/* Keep the existing Rally design consistent across controls and catalog pages. */
body[data-brand-preset="pdfrally"][data-brand-preset]{--brand-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-family:var(--brand-font);--accent:#2458cb!important;--accent-soft:#edf2ff;--accent-contrast:#fff;--panel:#fff;--panel-muted:#f2f4f5;--text:#23272b;--text-soft:#59626a;--line:#dce1e3;--line-strong:#8c979f;--input-line:#8c979f;background:#fff}
:root[data-theme="dark"] body[data-brand-preset="pdfrally"][data-brand-preset]{--accent:#a3beff!important;--accent-soft:#2b364e;--accent-contrast:#151b22;--panel:#242729;--panel-muted:#2b2f31;--text:#f1f3f2;--text-soft:#b9c3c7;--line:#3e4549;--line-strong:#879196;--input-line:#879196;background:#1b1e20}
body[data-brand-preset="pdfrally"] :is(h1,h2,h3,h4,p,a,span,label,legend,summary,small,strong,em,button,input,select,textarea){font-family:var(--brand-font)}
body[data-brand-preset="pdfrally"] .shell{background:transparent;border:0;box-shadow:none;border-radius:0}
body[data-brand-preset="pdfrally"] :is(.catalog-hero,.tool-card,.site-header){background:var(--panel)}
body[data-brand-preset="pdfrally"] .footer-brand{display:grid;gap:8px}
body[data-brand-preset="pdfrally"] .laboratory-attribution{font-size:12px}
/* UI-PDFRALLY-MENU: drawer navigation (PdfRallyNav.astro). Lives here, not in the component: Astro would attach component styles to every site that imports the component. */
.rn { --rn-gutter: 0px; position: relative; min-width: 0; font-family: var(--brand-font, inherit); color: var(--text); }
/* No z-index while closed: a stacking context here would paint the bar over the header's open language list. */
.rn[data-open="true"] { z-index: 50; }
.rn[data-mode="workbench"] { --rn-gutter: 24px; padding: 12px var(--rn-gutter) 0; }
.rn *, .rn *::before, .rn *::after { box-sizing: border-box; }
.rn a { color: var(--text); text-decoration: none; }
.rn ul { margin: 0; padding: 0; list-style: none; }
.rn h2 { margin: 0; letter-spacing: 0; }
.rn-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.rn a:focus-visible, .rn button:focus-visible, .rn input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.rn-status-label { margin: 0 0 8px; }

/* Bar */
.rn-bar { display: grid; gap: 12px; align-items: stretch; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.rn[data-mode="workbench"] { margin-bottom: 8px; }
.rn-quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; min-width: 0; }
.rn-quick a { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); font-size: 14px; font-weight: 600; line-height: 1.3; text-align: center; text-wrap: balance; overflow-wrap: anywhere; hyphens: auto; transition: background-color .15s, border-color .15s, color .15s; }
.rn-quick a:hover { background: var(--panel-muted); }
.rn-quick a[aria-current="page"] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }

.rn-find label { position: relative; display: block; }
.rn-find label::before { content: ""; position: absolute; inset-inline-start: 13px; top: 50%; width: 11px; height: 11px; margin-top: -8px; border: 2px solid var(--text-soft); border-radius: 50%; pointer-events: none; }
.rn-find label::after { content: ""; position: absolute; inset-inline-start: 24px; top: 50%; width: 2px; height: 6px; margin-top: 2px; background: var(--text-soft); transform: rotate(-45deg); pointer-events: none; }
[dir="rtl"] .rn-find label::after { transform: rotate(45deg); }
.rn-find input { width: 100%; min-width: 0; min-height: 44px; padding: 0 12px; padding-inline-start: 40px; border: 1px solid var(--input-line); border-radius: 6px; background: var(--panel); color: var(--text); font: inherit; font-size: 15px; }
.rn-find input::placeholder { color: var(--text-soft); opacity: 1; }
.rn-count { flex: 0 0 auto; min-width: 2.2ch; padding: 2px 7px; border-radius: 999px; background: color-mix(in srgb, currentColor 14%, transparent); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.4; text-align: center; }
.rn-toggle { gap: 10px; justify-content: space-between; min-width: 0; min-height: 44px; padding: 0 14px; border-radius: 6px; font-size: 15px; font-weight: 700; line-height: 1.25; text-align: start; }
.rn-toggle-label { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.rn-toggle-icon { flex: 0 0 18px; width: 18px; height: 18px; }

/* Panel: closed = not rendered for AT and pointer (inert + visibility), never display:none, so the page never reflows. */
.rn-panel { position: absolute; z-index: 60; top: calc(100% + 4px); inset-inline: var(--rn-gutter); display: flex; flex-direction: column; max-height: min(78vh, 640px); overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); box-shadow: 0 6px 20px rgb(0 0 0 / .12); visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .14s ease, visibility 0s linear .14s; }
.rn[data-open="true"] .rn-panel { visibility: visible; opacity: 1; pointer-events: auto; transition: opacity .14s ease; }
.rn-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px 16px; align-items: center; flex: 0 0 auto; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.rn-head-top { display: contents; }
.rn-title { margin: 0; font-size: 16px; font-weight: 700; }
.rn-status { grid-column: 1 / -1; margin: 0; color: var(--text-soft); font-size: 14px; }
.rn-status:empty { display: none; }
.rn-clear { grid-column: -2 / -1; justify-self: end; min-height: 40px; padding: 0 12px; border-radius: 6px; font-size: 14px; font-weight: 600; white-space: normal; }
.rn-clear[hidden] { display: none; }
.rn-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.rn-groups { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 16px 20px 20px; }
.rn-group[hidden], .rn-group li[hidden] { display: none; }
.rn-group + .rn-group { margin-top: 20px; }
.rn-group-title { display: flex; align-items: center; gap: 10px; margin: 0 0 8px !important; color: var(--text); font-size: 15px; font-weight: 700; line-height: 1.3; }
.rn-group-title .rn-count { background: var(--panel-muted); color: var(--text-soft); }
.rn-group ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 2px 16px; }
.rn-group li a { display: flex; align-items: center; min-width: 0; min-height: 40px; padding: 6px 10px; border-radius: 4px; color: var(--text); font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.rn-group li a:hover { background: var(--panel-muted); }
.rn-group li a[aria-current="page"] { background: var(--accent-soft); color: var(--accent); box-shadow: inset 3px 0 var(--accent); }
[dir="rtl"] .rn-group li a[aria-current="page"] { box-shadow: inset -3px 0 var(--accent); }

/* Left drawer */
.rn .rn-bar { grid-template-columns: minmax(0, 1fr); }
.rn .rn-toggle { justify-content: flex-start; border: 1px solid var(--accent); background: var(--panel); color: var(--accent); }
.rn .rn-toggle-label { flex: 0 1 auto; }
.rn .rn-toggle .rn-count { margin-inline-start: auto; }
.rn .rn-toggle-icon { background: linear-gradient(currentColor 0 0) 0 2px / 100% 2px no-repeat, linear-gradient(currentColor 0 0) 0 8px / 100% 2px no-repeat, linear-gradient(currentColor 0 0) 0 14px / 100% 2px no-repeat; }
.rn .rn-quick a { border-color: transparent; border-radius: 999px; background: var(--panel-muted); }
.rn .rn-quick a:hover { background: var(--accent-soft); }
.rn .rn-quick a[aria-current="page"] { border-color: var(--accent); background: var(--accent); color: var(--accent-contrast); }
.rn .rn-panel { position: fixed; top: 0; bottom: 0; inset-inline-start: 0; inset-inline-end: auto; width: min(420px, calc(100vw - 40px)); max-height: none; border-width: 0 1px 0 0; border-radius: 0; box-shadow: 0 0 32px rgb(0 0 0 / .25); transform: translateX(-104%); opacity: 1; transition: transform .22s ease, visibility 0s linear .22s; z-index: 70; }
[dir="rtl"] .rn .rn-panel { border-width: 0 0 0 1px; transform: translateX(104%); }
.rn[data-open="true"] .rn-panel { transform: none; transition: transform .22s ease; }
.rn .rn-head { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px 20px 14px; }
.rn .rn-head-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rn .rn-title { font-size: 18px; }
.rn .rn-close { flex: 0 0 auto; width: 44px; min-height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--text); font-size: 24px; font-weight: 400; line-height: 1; }
.rn .rn-close:hover { background: var(--panel-muted); }
.rn .rn-clear { justify-self: start; }
.rn .rn-groups { padding: 0 20px 24px; }
.rn .rn-group + .rn-group { margin-top: 0; }
.rn .rn-group-title { position: sticky; top: 0; z-index: 1; margin: 0 !important; padding: 14px 0 8px; background: var(--panel); border-bottom: 1px solid var(--line); }
.rn .rn-group ul { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 6px; }
.rn .rn-group li a { min-height: 44px; }
.rn-scrim { position: fixed; inset: 0; z-index: 65; background: rgb(8 12 18 / .5); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility 0s linear .2s; }
.rn[data-open="true"] .rn-scrim { opacity: 1; visibility: visible; transition: opacity .2s ease; }

/* Desktop */
@media (min-width: 768px) {
  .rn-quick { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rn .rn-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
  .rn .rn-toggle { flex: 0 0 auto; min-width: 230px; }
  .rn .rn-quick { display: flex; flex-wrap: wrap; flex: 1 1 360px; gap: 8px; }
  .rn .rn-quick a { min-height: 40px; padding: 6px 16px; }
}
/* Phone: the drawer takes most of the width. */
@media (max-width: 767px) {
  .rn[data-mode="workbench"] { --rn-gutter: 16px; padding-top: 8px; margin-bottom: 4px; }
  .rn-bar { gap: 8px; padding-bottom: 12px; }
    .rn-head { grid-template-columns: minmax(0, 1fr) auto; padding: 12px 16px; }
  .rn-groups { padding: 14px 16px 18px; }
  .rn .rn-panel { width: min(400px, calc(100vw - 32px)); }
  .rn .rn-head { padding: 14px 16px 12px; }
  .rn .rn-groups { padding: 0 16px 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .rn *, .rn *::before, .rn *::after { transition: none !important; }
}
/* UI-POLISH 14 (2026-10-10): the dropzone was a pale grey dashed box that was easy to miss; a soft accent tint
   (lighter than PDFLino's solid blue zone). Tokens only, so the dark theme follows --accent / --accent-soft. */
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files){border:2px dashed color-mix(in srgb,var(--accent) 60%,var(--line));background:var(--accent-soft)}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files):is(:hover,:focus-within,.is-dragging){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--accent-soft))}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone .drop-zone-icon{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:var(--panel)}
/* UI-POLISH 18 (2026-10-11): owner found the UI-POLISH 14 tint too subtle. A clearly accent dropzone with a larger
   accent icon, from the tokens, so the dark theme follows. Replaces the three rules above where they overlap. */
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files){border:2px dashed var(--accent);background:color-mix(in srgb,var(--accent) 11%,var(--panel))}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files):is(:hover,:focus-within,.is-dragging){border-style:solid;background:color-mix(in srgb,var(--accent) 17%,var(--panel))}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files) strong{color:var(--accent);font-size:19px}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files) p{color:var(--text)}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files) .drop-zone-icon{margin:10px;transform:scale(1.45);border-color:var(--accent);background:var(--accent);color:var(--accent-contrast);box-shadow:none}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files) .drop-zone-icon::before{background:transparent}
body[data-brand-preset="pdfrally"][data-brand-preset] .drop-zone:not(.has-files) .drop-zone-icon::after{background:var(--accent)}

/* UI-POLISH 18: home band (PDFRallyHero.astro) with the site's promise in large type on the brand blue. */
body[data-brand-preset="pdfrally"] .rally-intro{margin:16px 24px 4px;padding:36px 40px 38px;border-radius:8px;background:var(--accent);color:var(--accent-contrast)}
body[data-brand-preset="pdfrally"] .rally-intro p{margin:0;color:inherit}
body[data-brand-preset="pdfrally"] .rally-intro-title{max-width:22ch;font-size:clamp(30px,3.4vw,46px);font-weight:800;line-height:1.08;letter-spacing:-.02em;text-wrap:balance}
body[data-brand-preset="pdfrally"] .rally-intro-lead{max-width:62ch;margin-top:14px!important;font-size:18px;line-height:1.5;opacity:.92}
:root[data-theme="dark"] body[data-brand-preset="pdfrally"] .rally-intro{background:var(--accent-soft);color:var(--text);box-shadow:inset 0 4px var(--accent)}
:root[data-theme="dark"] body[data-brand-preset="pdfrally"] .rally-intro-title{color:var(--accent)}
@media (max-width:767px){
  body[data-brand-preset="pdfrally"] .rally-intro{margin:10px 16px 2px;padding:20px 18px 22px}
  body[data-brand-preset="pdfrally"] .rally-intro-title{font-size:27px}
  body[data-brand-preset="pdfrally"] .rally-intro-lead{margin-top:8px!important;font-size:15px}
}

/* UI-POLISH 18: desktop task = workspace | inspector, the deskpdf pattern (deskpdf.css .pdf-task) in PDFRally's own
   look. The top bar (All PDF tools + task chips + drawer) stays. --pdf-task-group/--pdf-task-title come from
   PdfWorkspace (appFrame). Phone and tablet keep the single column. */
@media (min-width:1100px){
  body[data-brand-preset="pdfrally"] .pdf-task{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:start;column-gap:32px}
  body[data-brand-preset="pdfrally"] :is(.pdf-task-body,.tool-panel){display:contents}
  body[data-brand-preset="pdfrally"] .pdf-task>:not(.pdf-task-body),
  body[data-brand-preset="pdfrally"] .pdf-task-body>:not(.tool-panel),
  body[data-brand-preset="pdfrally"] .tool-panel>:not(.file-review-layout){grid-column:1;min-width:0}
  body[data-brand-preset="pdfrally"] :is(.pdf-task,.pdf-task-body,.tool-panel)>:not(.file-review-layout):not(.tool-actions:only-of-type)+*{margin-top:16px}
  body[data-brand-preset="pdfrally"] :is(.file-review-layout,.tool-panel:not(:has(.file-review-settings))>.tool-actions){
    grid-column:2;grid-row:1/span 40;align-self:start;
    display:flex!important;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:16px;min-width:0;margin:0;
    padding:22px 22px 24px;border:1px solid var(--line);border-top:4px solid var(--accent);border-radius:8px;background:var(--panel-muted)}
  body[data-brand-preset="pdfrally"] .file-review-settings{display:flex!important;flex-direction:column;gap:16px;order:1;min-width:0}
  body[data-brand-preset="pdfrally"] .file-review-preview{display:block!important;order:2;min-width:0}
  body[data-brand-preset="pdfrally"] .file-review-preview:empty,
  body[data-brand-preset="pdfrally"] .file-review-layout .file-run-status:empty{display:none!important}
  body[data-brand-preset="pdfrally"] .file-review-preview .pdf-thumbnail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  body[data-brand-preset="pdfrally"] .file-review-preview .pdf-page-preview{margin:0;padding:14px 0 0;border-top:1px solid var(--line)}
  body[data-brand-preset="pdfrally"] :is(.file-review-layout,.tool-panel:not(:has(.file-review-settings))>.tool-actions)::before{
    content:var(--pdf-task-group,"");order:-2;display:block;margin:0;font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
  body[data-brand-preset="pdfrally"] :is(.file-review-layout,.tool-panel:not(:has(.file-review-settings))>.tool-actions)::after{
    content:var(--pdf-task-title,"");order:-1;display:block;margin:-12px 0 2px;font-size:20px;font-weight:700;line-height:1.25;color:var(--text)}
  body[data-brand-preset="pdfrally"] .file-review-settings .file-controls{grid-template-columns:minmax(0,1fr)}
  body[data-brand-preset="pdfrally"] .file-review-settings .tool-actions{flex-direction:column;align-items:stretch}
  body[data-brand-preset="pdfrally"] :is(.file-review-settings,.tool-panel)>.tool-actions button,
  body[data-brand-preset="pdfrally"] .file-review-layout :is(.tool-actions,.pdf-preview-toolbar) button.secondary,
  body[data-brand-preset="pdfrally"] .file-review-layout :is(.pdf-preview-open,.download){width:100%;justify-content:center;margin-inline:0}
}
/* UI-POLISH 18b (2026-10-11): on phones the home band is one compact line (no lead text), so the file dropzone stays on
   the first screen. The lead is still read by screen readers. */
@media (max-width: 767px) {
  body[data-brand-preset="pdfrally"] .rally-intro { padding: 14px 16px; }
  body[data-brand-preset="pdfrally"] .rally-intro-title { font-size: 22px; max-width: none; }
  body[data-brand-preset="pdfrally"] .rally-intro-lead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
/* Short phones (320x568 class): the band would push the file dropzone below the first screen, so it is kept for screen
   readers only there; the dropzone stays on the first screen. */
@media (max-width: 767px) and (max-height: 600px) {
  body[data-brand-preset="pdfrally"] .rally-intro { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
