/* V105: two-row ribbon, matching the supplied MioPDF reference. */
#officeEditorToolbar.office-ribbon {
  --ribbon-surface:#f8fbff; --ribbon-field:#fff; --ribbon-line:#d5e4ff;
  --ribbon-ink:#12375d; --ribbon-top:#edf3ff;
  display:flex!important; flex-direction:column!important; align-items:stretch!important;
  width:100%!important; min-width:0!important; height:auto!important;
  min-height:0!important; max-height:none!important; padding:0!important; gap:0!important;
  position:relative!important; z-index:80; overflow:visible!important;
  background:var(--ribbon-surface)!important; border:0!important;
  border-bottom:1px solid var(--ribbon-line)!important;
}
#officeEditorToolbar .office-ribbon-top {
  position:relative; z-index:2; display:flex; align-items:center; flex-wrap:wrap;
  gap:12px; padding:6px 16px; min-width:0;
  background:linear-gradient(105deg,var(--ribbon-top),var(--ribbon-surface));
  border-bottom:1px solid var(--ribbon-line);
}
#officeEditorToolbar .office-format-bar {
  display:flex; flex:1 1 auto; align-items:center; flex-wrap:wrap; gap:14px; min-width:0;
}
#officeEditorToolbar :is(.office-format-toggles,.office-alignment-controls) {
  display:flex; flex:0 0 auto; height:34px; padding:2px;
  border:1px solid var(--ribbon-line); border-radius:7px; background:var(--ribbon-field);
  box-shadow:0 2px 5px #2563eb0b;
}
#officeEditorToolbar .office-format-button {
  display:grid; place-items:center; width:35px; min-width:35px; height:28px;
  padding:0; margin:0; border:0; border-right:1px solid var(--ribbon-line);
  border-radius:0; color:var(--ribbon-ink); background:transparent; font-size:13px;
}
#officeEditorToolbar .office-format-button:last-child { border-right:0; }
#officeEditorToolbar .office-format-button:hover { background:var(--ui-hover); }
#officeEditorToolbar .office-format-button svg { width:16px; height:16px; color:#1675f8; pointer-events:none; }
#officeEditorToolbar .office-format-button svg * { pointer-events:none; }
#officeEditorToolbar :is(.office-font-size-control,.office-toolbar-color-control) {
  display:flex!important; flex:0 0 auto!important; align-items:center!important; gap:7px!important;
  height:34px!important; min-height:34px!important; padding:3px 7px!important;
  border:1px solid var(--ribbon-line)!important; border-radius:7px!important;
  background:var(--ribbon-field)!important; color:var(--ribbon-ink)!important;
  box-shadow:0 2px 5px #2563eb0b; font-size:9px!important; font-weight:800!important;
}
#officeEditorToolbar .office-font-size-control { width:116px; }
#officeEditorToolbar .office-font-size-combo { height:26px; min-width:0; background:var(--ribbon-field); border-color:var(--ribbon-line); border-radius:5px; }
#officeEditorToolbar .office-font-size-combo input[type="number"] { width:38px!important; height:24px!important; color:var(--ribbon-ink)!important; font-size:10px!important; }
#officeEditorToolbar .office-font-size-combo > button { width:23px; height:24px; color:var(--ribbon-ink); border-color:var(--ribbon-line); background:var(--ribbon-surface); }
#officeEditorToolbar .office-toolbar-color-control { width:98px; }
#officeEditorToolbar .office-toolbar-color-control .office-color-picker-btn {
  flex:1 1 auto; justify-content:space-between; min-width:0; height:26px; padding:2px 5px;
  border:1px solid var(--ribbon-line); border-radius:5px;
  background:var(--ribbon-field); color:var(--ribbon-ink);
}
#officeEditorToolbar .office-toolbar-color-control .office-color-preview { flex:0 0 19px; width:19px; height:19px; border-radius:4px; }
#officeEditorToolbar .office-toolbar-color-control .office-color-picker-btn b { font-size:9px; }
#officeEditorToolbar :is(.office-ribbon-lists,.office-ribbon-actions) { display:flex; align-items:center; flex:0 0 auto; gap:8px; }
#officeEditorToolbar .office-ribbon-actions { margin-inline-start:auto; padding-inline-start:14px; border-inline-start:1px solid var(--ribbon-line); }

/* Every tool retains its existing ID and event attributes. */
#officeEditorToolbar .office-ribbon-tool {
  --tool-color:#1676fa; --tool-ink:#00448f; --tool-bg:#f0f6ff; --tool-line:#d8e7ff;
  --office-icon-cutout:#fff;
  position:relative!important; display:flex!important; flex-direction:column!important;
  align-items:center!important; justify-content:center!important; gap:4px!important;
  flex:none!important; width:100%!important; min-width:0!important; max-width:none!important;
  height:52px!important; min-height:52px!important; max-height:none!important;
  margin:0!important; padding:5px 4px!important; border:1px solid var(--tool-line)!important;
  border-bottom:2px solid var(--tool-color)!important; border-radius:7px!important;
  background:linear-gradient(145deg,var(--tool-bg),var(--ribbon-surface))!important;
  color:var(--tool-ink)!important; box-shadow:0 3px 7px #1859b30a!important;
  cursor:pointer; transition:background .12s ease,border-color .12s ease;
}
#officeEditorToolbar .office-ribbon-tool[data-tool-tone="cyan"] { --tool-color:#08adba; --tool-ink:#00647a; --tool-bg:#eefbfc; --tool-line:#d7f0f3; }
#officeEditorToolbar .office-ribbon-tool[data-tool-tone="purple"] { --tool-color:#9139f7; --tool-ink:#7626d7; --tool-bg:#f7f1ff; --tool-line:#ecdeff; }
#officeEditorToolbar .office-ribbon-tool[data-tool-tone="green"] { --tool-color:#059c67; --tool-ink:#006344; --tool-bg:#effbf6; --tool-line:#d9f1e7; }
#officeEditorToolbar .office-ribbon-tool[data-tool-tone="amber"] { --tool-color:#f5b400; --tool-ink:#855200; --tool-bg:#fffaef; --tool-line:#faecd5; }
#officeEditorToolbar .office-ribbon-tool[data-tool-tone="red"] { --tool-color:#ef2452; --tool-ink:#bc1237; --tool-bg:#fff2f5; --tool-line:#ffe0e9; }
#officeEditorToolbar .office-ribbon-tool[data-tool-tone="pink"] { --tool-color:#eb3b72; --tool-ink:#ae1649; --tool-bg:#fff2f7; --tool-line:#ffdfed; }
#officeEditorToolbar .office-ribbon-tool:hover { border-color:var(--tool-color)!important; background:var(--tool-bg)!important; }
#officeEditorToolbar .office-ribbon-tool.active {
  --office-icon-cutout:#1676fa;
  border-color:var(--tool-color)!important; color:#fff!important;
  background:linear-gradient(145deg,#2875f5,#078cf9)!important;
  box-shadow:0 4px 8px #1977fa29!important;
}
#officeEditorToolbar .office-ribbon-tool:disabled { opacity:.42!important; cursor:default!important; }
#officeEditorToolbar.office-ribbon .office-tool-glyph {
  display:grid!important; place-items:center!important; width:23px!important; height:23px!important;
  flex:0 0 23px; margin:0!important; font:800 21px/1 Arial,sans-serif!important;
  color:var(--tool-color)!important; pointer-events:none;
}
#officeEditorToolbar .office-ribbon-tool.active .office-tool-glyph { color:#fff!important; }
#officeEditorToolbar.office-ribbon .office-tool-glyph svg { width:100%; height:100%; overflow:visible; pointer-events:none; }
#officeEditorToolbar.office-ribbon .office-tool-glyph svg * { pointer-events:none; }
#officeEditorToolbar.office-ribbon .office-tool-label {
  display:block!important; max-width:100%; margin:0!important; padding:0!important;
  font-size:clamp(9px,.6vw,11px)!important; font-weight:800!important; line-height:1.15!important;
  color:inherit!important; white-space:normal!important; overflow:visible!important;
  overflow-wrap:normal; text-overflow:clip!important; text-align:center; pointer-events:none;
}
#officeEditorToolbar.office-ribbon .office-ribbon-action {
  width:68px!important; min-width:60px!important; height:34px!important; min-height:34px!important;
  padding:2px 6px!important; gap:1px!important; border-bottom-width:1px!important;
  border-color:var(--ribbon-line)!important; border-radius:7px!important;
  background:var(--ribbon-surface)!important; color:var(--ribbon-ink)!important;
}
#officeEditorToolbar .office-ribbon-action .office-tool-glyph { width:17px!important; height:17px!important; flex-basis:17px; font-size:16px!important; }
#officeEditorToolbar .office-ribbon-action .office-tool-label { font-size:8px!important; }
#officeEditorToolbar .office-ribbon-lists .office-ribbon-action { width:64px!important; }
#officeEditorToolbar .office-ribbon-action.active { background:#dceaff!important; }
#officeEditorToolbar .office-ribbon-action.active .office-tool-glyph { color:#1676fa!important; }
#officeEditorToolbar #officeZoomToggleBtn { width:78px!important; flex-direction:row!important; gap:8px!important; }
#officeEditorToolbar.office-ribbon .office-editor-close-tool {
  position:relative!important; inset:auto!important; display:grid!important; place-items:center!important;
  flex:0 0 34px!important; width:34px!important; height:34px!important;
  min-width:34px!important; min-height:34px!important; max-height:34px!important;
  margin:0!important; padding:0!important; border:0!important; border-radius:7px!important;
  background:#ef123c!important; color:#fff!important; font:800 25px/1 Arial,sans-serif!important;
  box-shadow:0 2px 6px #ef123c1c!important;
}

/* Four proportional groups, in the exact order of the reference. */
#officeEditorToolbar.office-ribbon > .office-ribbon-groups {
  position:relative; z-index:1; display:grid!important; grid-template-columns:4fr 5fr 3fr 3fr!important;
  grid-template-rows:auto!important; grid-auto-flow:row!important;
  flex:none!important; width:100%!important; min-width:0!important; max-width:none!important;
  height:auto!important; min-height:0!important; max-height:none!important;
  padding:7px 16px 10px!important; gap:14px!important; overflow:visible!important;
}
#officeEditorToolbar .office-ribbon-group { --group-color:#1775ff; display:flex; flex-direction:column; gap:6px; min-width:0; }
#officeEditorToolbar .office-group-insert { --group-color:#9139f7; }
#officeEditorToolbar .office-group-annotate { --group-color:#e9a629; }
#officeEditorToolbar .office-group-adjust { --group-color:#06a6bc; }
#officeEditorToolbar .office-ribbon-group + .office-ribbon-group { padding-inline-start:14px; border-inline-start:1px solid #ccdcfa; }
#officeEditorToolbar .office-ribbon-title { display:flex; align-items:center; gap:5px; font-size:8.5px; line-height:10px; font-weight:850; letter-spacing:.025em; color:var(--group-color); }
#officeEditorToolbar .office-ribbon-title::after { content:""; height:1px; flex:1; background:var(--group-color); opacity:.5; }
#officeEditorToolbar .office-ribbon-buttons { display:grid; grid-template-columns:repeat(var(--tool-count),minmax(0,1fr)); gap:8px; min-width:0; }
#officeEditorToolbar.office-ribbon :is(.office-tool-drop-icon,.page-border-arrow) {
  position:absolute!important; inset:auto 3px 3px auto!important;
  display:grid!important; place-items:center!important; width:12px!important; height:12px!important;
  margin:0!important; padding:0!important; border:0!important; background:transparent!important;
  color:var(--tool-color)!important; font-size:7px!important; font-style:normal!important;
  line-height:1!important; opacity:.65;
}
#officeEditorToolbar.office-ribbon .has-color-dropdown::after { display:none!important; }
#officeEditorToolbar.office-ribbon .office-ribbon-tool.active .office-tool-drop-icon { color:#fff!important; }
#officeEditorToolbar.office-ribbon :is(button,input):focus-visible { outline:3px solid var(--ui-focus); outline-offset:2px; }
#officeEditorToolbar.office-ribbon .hidden { display:none!important; }

html[data-theme="dark"] #officeEditorToolbar.office-ribbon {
  --ribbon-surface:#182439; --ribbon-field:#1f304a; --ribbon-line:#3b5274;
  --ribbon-ink:#e2edff; --ribbon-top:#1d2f4a;
}
html[data-theme="dark"] #officeEditorToolbar .office-ribbon-tool {
  --tool-bg:#203858; --tool-ink:#bedbff; --tool-line:#365985; --tool-color:#6ea9ff;
  --office-icon-cutout:#203858;
}
html[data-theme="dark"] #officeEditorToolbar [data-tool-tone="cyan"] { --tool-bg:#153b48; --tool-ink:#b3f4ef; --tool-line:#285560; --tool-color:#4ad1d6; }
html[data-theme="dark"] #officeEditorToolbar [data-tool-tone="purple"] { --tool-bg:#33274c; --tool-ink:#e6cdff; --tool-line:#564072; --tool-color:#bd8fff; }
html[data-theme="dark"] #officeEditorToolbar [data-tool-tone="green"] { --tool-bg:#193c32; --tool-ink:#b5f6d7; --tool-line:#315e4c; --tool-color:#57d99a; }
html[data-theme="dark"] #officeEditorToolbar [data-tool-tone="amber"] { --tool-bg:#40351e; --tool-ink:#ffe4a5; --tool-line:#6b552e; --tool-color:#ffd065; }
html[data-theme="dark"] #officeEditorToolbar :is([data-tool-tone="red"],[data-tool-tone="pink"]) { --tool-bg:#432639; --tool-ink:#ffd0e0; --tool-line:#6d3953; --tool-color:#ff7095; }
html[data-theme="dark"] #officeEditorToolbar .office-ribbon-tool.active { --office-icon-cutout:#1676fa; }
html[data-theme="dark"] #officeEditorToolbar .office-ribbon-action.active { background:#2e507f!important; }
html[data-theme="dark"] #officeEditorToolbar .office-ribbon-action.active .office-tool-glyph { color:#b5d7ff!important; }

@media(max-width:1100px) {
  #officeEditorToolbar .office-ribbon-top { display:grid; grid-template-columns:minmax(0,1fr) 34px; gap:7px 10px; }
  #officeEditorToolbar .office-format-bar { grid-column:1; grid-row:1; gap:8px; }
  #officeEditorToolbar .office-ribbon-actions { grid-column:1; grid-row:2; margin:0; padding:0; border:0; }
  #officeEditorToolbar.office-ribbon .office-editor-close-tool { grid-column:2; grid-row:1; align-self:start; }
}
@media(max-width:1000px) {
  #officeEditorToolbar.office-ribbon > .office-ribbon-groups { grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; row-gap:12px!important; }
  #officeEditorToolbar .office-ribbon-group:nth-child(3) { padding-inline-start:0; border-inline-start:0; }
}
@media(max-width:650px) {
  #officeEditorToolbar .office-ribbon-top { padding:7px 8px; }
  #officeEditorToolbar .office-format-bar { gap:6px; }
  #officeEditorToolbar :is(.office-font-size-control,.office-toolbar-color-control) { gap:5px!important; padding-inline:5px!important; }
  #officeEditorToolbar .office-format-button { width:30px; min-width:30px; }
  #officeEditorToolbar.office-ribbon > .office-ribbon-groups { grid-template-columns:minmax(0,1fr)!important; padding:7px 8px 10px!important; }
  #officeEditorToolbar .office-ribbon-group + .office-ribbon-group { padding-inline-start:0; border-inline-start:0; }
}