/* Landing green/cream system, scoped to Workspace so the result viewer is unchanged. */
.console.justocr {
  --wash: #f8f7f1; --paper: #fffefa; --ink: #18352b; --muted: #53665b;
  --line: #d6ddd1; --green: #17674c; --mint: #e8f0e7; --lime: #e1ef9b;
  --blue: var(--green); --jo-page: var(--wash); --jo-surface: var(--paper);
  --jo-text: var(--ink); --jo-muted: var(--muted); --jo-border: var(--line);
  --jo-accent: var(--green); --jo-accent-hover: var(--ink); --jo-focus: var(--green);
  --jo-on-accent: var(--paper); --jo-active: var(--mint);
  --control-border: #797f79; --disabled-bg: #e8eae4;
  font: 400 16px/1.6 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--wash); color: var(--ink); -moz-osx-font-smoothing: grayscale;
}
.console.justocr a:where(:not(.button)) { color: var(--green); }
.console.justocr ::selection { background: var(--lime); color: var(--ink); }
.console.justocr :focus-visible { outline: 3px solid var(--green); outline-offset: 4px; }
.console .app-header { min-height: 76px; height: auto; padding: 14px 24px; background: var(--paper); }
.console .app-header .brand { min-height: 44px; gap: 10px; font-size: 1.35rem; font-weight: 700; letter-spacing: -.04em; color: var(--ink); }
.console.justocr .app-header .brand-logo { width: 29px; height: 29px; flex: none; color: var(--green); }
.console .app-layout { min-height: calc(100vh - 76px); grid-template-columns: 210px minmax(0, 1fr); }
.console .sidebar { background: var(--wash); padding: 28px 16px; }
.console.justocr .sidebar a { display: flex; align-items: center; min-height: 44px; font-size: .875rem; color: var(--muted); }
.console.justocr .sidebar a:hover { background: var(--mint); color: var(--ink); }
.console.justocr .sidebar a[aria-current="page"] { background: var(--mint); color: var(--ink); font-weight: 650; }
.console .workspace { max-width: 1160px; padding: 32px; }
.console .page-intro { margin-bottom: 24px; }
.console .page-intro .eyebrow { font-size: .75rem; color: var(--green); }
.console h1, .console h2, .console h3 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.console h1 { font-size: 2rem; letter-spacing: -.035em; }
.console h2 { font-size: 1.5rem; }
.console h3 { font-size: 1.25rem; }
.console .page-intro p { font-size: 1rem; }
.console .card { background: var(--paper); border-radius: 12px; padding: 24px; }
.console small, .console .statusline, .console .pending-note, .console .footer-note { font-size: .8125rem; color: var(--muted); }
.console label, .console summary, .console table { font-size: .875rem; }
.console button, .console .button { min-height: 46px; padding: 10px 18px; border-radius: 7px; border-color: var(--green); background: var(--green); color: var(--paper); font-size: .875rem; font-weight: 650; }
.console button:hover, .console .button:hover { background: var(--ink); }
.console button.secondary, .console .button.secondary { background: var(--paper); color: var(--ink); border-color: var(--control-border); }
.console button.secondary:hover, .console .button.secondary:hover { background: var(--mint); }
.console button:disabled { background: var(--disabled-bg); color: var(--muted); border-color: var(--line); }
.console input, .console select { background: var(--paper); color: var(--ink); border-color: var(--control-border); border-radius: 6px; font-size: 16px; }
.console input:disabled, .console select:disabled { background: var(--disabled-bg); color: var(--muted); }
.console .upload-area { background: var(--mint); border-color: var(--line); border-radius: 10px; }
.console .steps { font-size: .8125rem; }
.console .steps b { color: var(--green); border-color: var(--control-border); }
.console .tag { color: var(--ink); background: var(--mint); font-size: .75rem; }
.console .tag.running, .console .tag.queued, .console .banner.info { background: var(--mint); color: var(--ink); border-color: var(--line); }
.console .tag.complete, .console .banner.success { background: #edf6ef; color: #256044; border-color: #bfdece; }
.console .tag.failed, .console .banner.error { background: #fff2ef; color: #a52d26; border-color: #efc8c5; }
.console .banner { font-size: .875rem; }
.console th { background: var(--mint); color: var(--ink); font-size: .8125rem; text-transform: none; letter-spacing: 0; }
.console .scroll { border: 1px solid var(--line); border-radius: 7px; }
.console .metric { font-variant-numeric: tabular-nums; }
.console .balance-card .metric { font-size: 2rem; }
.console .job-detail p { font-size: .875rem; }
.console .job-detail progress { accent-color: var(--green); }
.console .inline { align-items: start; }
.console .retention-group { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.console .retention-group legend { padding-inline: 6px; color: var(--muted); font-size: .8125rem; }
.console .receipt-choice { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; font-weight: 400; cursor: pointer; }
.console #upload-form input[type=checkbox] { flex: none; width: 20px; height: 20px; min-height: 20px; margin: 3px 0 0; padding: 0; accent-color: var(--green); }
.console .sla-note { padding-block-start: 16px; margin: 0; border-top: 1px solid var(--line); font-size: .875rem; }
.console .sla-note span { display: block; margin-top: 6px; color: var(--muted); font-size: .8125rem; }
.console > footer.content { padding: 20px 24px; border-top: 1px solid var(--line); background: var(--wash); }
@media(max-width:1050px) { .console .workspace { padding: 24px; } }
@media(max-width:700px) {
  .console .app-header { padding: 12px 16px; min-height: 70px; }
  .console .sidebar { padding: 8px 12px; gap: 4px; }
  .console.justocr .sidebar a { padding: 8px 10px; font-size: .8125rem; }
  .console .workspace { padding: 24px 16px; }
  .console .card { padding: 20px; }
  .console h1 { font-size: 1.75rem; }
  .console .retention-group { padding: 12px; }
  .console .toprow { align-items: flex-start; }
  .console .app-header .actions { flex: none; }
}
#staged-files { padding-left: 1.25rem; margin: 0; }
#staged-files li { margin-bottom: 1rem; overflow-wrap: anywhere; }
#staged-files button { margin: .5rem .5rem 0 0; }
#upload-form input[type=checkbox] { width: 1.25rem; min-height: 1.25rem; }
#batch-files { max-width: 100%; }
#job-detail, .result-row { overflow-wrap: anywhere; min-width: 0; }
.result-row { display: flex; flex-wrap: wrap; gap: .5rem 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.result-row span { flex-basis: 100%; }
#batch-submit { margin-top: 1rem; }
#api { overflow-wrap: anywhere; }
.console[data-active-view="api"] #anonymous-preview { display: none; }
@media(max-width:700px) { #staged-files button, #batch-submit { width: 100%; } }

/* Authenticated result viewer; document content stays inside its two scroll panes. */
.result-viewer-page { margin: 0; min-width: 0; overflow-x: hidden; background: var(--wash); }
.viewer-header { display: flex; align-items: center; gap: 1.25rem; min-width: 0; padding: 1rem clamp(1rem, 3vw, 2.5rem); border-bottom: 1px solid var(--line); background: var(--paper); }
.viewer-header .brand { flex: 0 0 auto; }
.viewer-header .brand-logo { display: block; max-width: 100%; }
.viewer-header div { min-width: 0; flex: 1; }
.viewer-header h1, .viewer-header p { margin: 0; overflow-wrap: anywhere; }
.viewer-main { width: 100%; min-width: 0; padding: 1rem clamp(.75rem, 2vw, 1.5rem) 1.5rem; }
.viewer-status { margin-bottom: .75rem; color: var(--muted); }
.viewer-toolbar, .viewer-control-group, .viewer-downloads { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; min-width: 0; }
.viewer-toolbar { justify-content: space-between; padding: .75rem; border: 1px solid var(--line); border-radius: .75rem .75rem 0 0; background: var(--paper); }
.viewer-toolbar button, .viewer-toolbar input { min-height: 2.75rem; }
.viewer-toolbar button { padding: .5rem .75rem; }
.viewer-toolbar input { width: 5rem; padding: .4rem; }
.viewer-downloads a { padding: .55rem .7rem; border: 1px solid var(--line); border-radius: .4rem; background: var(--paper); }
.viewer-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(20rem, 1fr); height: min(76vh, 58rem); min-height: 30rem; border: 1px solid var(--line); border-top: 0; background: var(--paper); }
.viewer-pane { min-width: 0; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.viewer-preview { padding: 1rem; background: #2b3037; }
.viewer-page { position: relative; margin: auto; max-width: none; background: #fff; box-shadow: 0 .4rem 1.5rem #0006; }
.viewer-page img { display: block; width: 100%; height: auto; user-select: none; }
.viewer-box { position: absolute; z-index: 1; min-width: 0; min-height: 0; padding: 0; border: 2px solid var(--block-color); border-radius: 2px; background: color-mix(in srgb, var(--block-color) 12%, transparent); cursor: pointer; }
.viewer-box:hover, .viewer-box.linked, .viewer-box.selected, .viewer-box:focus-visible { z-index: 2; border-width: 3px; background: color-mix(in srgb, var(--block-color) 25%, transparent); }
.viewer-text { border-left: 1px solid var(--line); background: var(--paper); }
.viewer-filters { position: sticky; top: 0; z-index: 3; display: flex; flex-wrap: wrap; gap: .45rem; padding: .75rem; border-bottom: 1px solid var(--line); background: var(--paper); }
.viewer-filter { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.5rem; padding: .35rem .55rem; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: inherit; }
.viewer-filter i { width: .7rem; height: .7rem; border-radius: 50%; background: var(--block-color); }
.viewer-filter[aria-pressed="false"] { opacity: .55; text-decoration: line-through; }
.viewer-filter-note { color: var(--muted); }
.viewer-output { min-width: 0; padding: .75rem; }
.viewer-block { min-width: 0; margin: 0 0 .75rem; padding: .75rem; border: 1px solid var(--line); border-left: .3rem solid var(--block-color, var(--line)); border-radius: .45rem; overflow-wrap: anywhere; background: var(--paper); }
.viewer-block.linked, .viewer-block.selected, .viewer-block:focus-visible { outline: 3px solid color-mix(in srgb, var(--block-color) 45%, transparent); outline-offset: 1px; }
.viewer-block-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-bottom: .5rem; color: var(--muted); font-size: .82rem; }
.viewer-block-meta strong { color: var(--block-color); }
.viewer-block p { margin: 0 0 .65rem; white-space: pre-wrap; }
.viewer-block p:last-child { margin-bottom: 0; }
.viewer-markdown > :first-child { margin-top: 0; }
.viewer-markdown > :last-child { margin-bottom: 0; }
.viewer-markdown pre { max-width: 100%; overflow: auto; white-space: pre-wrap; }
.viewer-table-wrap { max-width: 100%; overflow: auto; }
.viewer-table-copy { display: block; width: 2.5rem; min-height: 2.5rem; margin: 0 0 .4rem auto; padding: .45rem; }
.viewer-table-copy svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.viewer-table-wrap table { width: 100%; border-collapse: collapse; background: var(--paper); }
.viewer-table-wrap caption { text-align: left; font-weight: 700; }
.viewer-table-wrap th, .viewer-table-wrap td { padding: .45rem .55rem; border: 1px solid var(--line); text-align: left; vertical-align: top; white-space: pre-wrap; }
.viewer-table-wrap th { background: var(--surface-2, #f4f5f6); }
.viewer-raw { margin: 0; max-width: 100%; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.viewer-output-empty, .viewer-state { padding: 2rem; color: var(--muted); }
.viewer-state { border: 1px solid var(--line); border-radius: .75rem; background: var(--paper); }
.viewer-state h2 { color: var(--ink); }
.viewer-state.error { border-color: var(--red); }
.result-viewer-page :where(button, a, input, [tabindex]):focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
@media(max-width:800px) {
  .viewer-header { align-items: flex-start; flex-wrap: wrap; }
  .viewer-header .button { margin-left: auto; }
  .viewer-toolbar { align-items: stretch; }
  .viewer-toolbar, .viewer-downloads { justify-content: flex-start; }
  .viewer-shell { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(20rem, 48vh) minmax(18rem, 1fr); height: auto; min-height: 0; }
  .viewer-text { max-height: 55vh; border-top: 1px solid var(--line); border-left: 0; }
}
@media(max-width:480px) {
  .viewer-header .brand { width: 7.5rem; }
  .viewer-header div { flex-basis: calc(100% - 9rem); }
  .viewer-header .button { width: 100%; text-align: center; }
  .viewer-toolbar > *, .viewer-control-group { max-width: 100%; }
  .viewer-control-group { flex: 1 1 100%; }
  .viewer-downloads { flex: 1 1 100%; }
}
