/* Tokens from docs/ux/design-system.md §3.10. Logical properties only. */
:root {
  --c-canvas:#F3F4F6; --c-surface:#FFFFFF; --c-sunken:#EAECEF; --c-hover:#EEF2F4;
  --c-line-subtle:#E1E4E8; --c-line:#CBD0D6; --c-line-strong:#8791A0;
  --c-text:#17212B; --c-text-2:#4B5667; --c-text-3:#5F6B7C; --c-text-inverse:#FFFFFF;
  --c-primary-50:#E7F1F3; --c-primary-100:#CFE4E9; --c-primary-500:#2A7384;
  --c-primary-600:#1D5C6B; --c-primary-700:#164A57;
  --c-success:#1E6B45; --c-success-tint:#E4F2EA;
  --c-danger:#B3261E; --c-danger-tint:#FBEAE8;
  --c-warning:#7A4F00; --c-warning-tint:#FFF2D1; --c-warning-line:#D9A441;
  --c-pencil-text:#4B5667; --c-pencil-line:#7B8696; --pencil-angle:135deg;
  --pencil-hatch:repeating-linear-gradient(var(--pencil-angle),#EEF0F3 0 1px,#FFFFFF 1px 5px);
  --f-ui:"IBM Plex Sans Arabic","IBM Plex Sans","Noto Sans Arabic","Segoe UI",Tahoma,system-ui,sans-serif;
  --f-num:"IBM Plex Sans","Segoe UI",Tahoma,system-ui,sans-serif;
  --fs-xs:12px; --fs-sm:13px; --fs-base:14px; --fs-md:16px; --fs-lg:20px; --fs-xl:26px;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px;
  --r-1:2px; --r-2:3px; --r-3:6px; --r-4:10px;
  --row-h:34px; --ctl-h:32px; --header-h:48px;
  --elev-1:0 1px 2px rgba(23,33,43,.12);
  --m-fast:120ms ease-out; --m-base:200ms ease-out;
  --focus-ring:2px solid var(--c-primary-600);
}
:lang(ar) { --fs-xs:13px; --fs-sm:14px; --fs-base:15px; --fs-md:17px; --fs-lg:21px; --fs-xl:27px; }
[dir="rtl"] { --pencil-angle:45deg; }

*, *::before, *::after { box-sizing: border-box; }
html { font-family: var(--f-ui); font-size: var(--fs-base); color: var(--c-text); background: var(--c-canvas); }
body { margin: 0; line-height: 1.5; min-block-size: 100vh; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; }
h1 { font-size: var(--fs-lg); } h2 { font-size: var(--fs-md); } h3 { font-size: var(--fs-base); }
a { color: var(--c-primary-500); }
:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }
.sr-only { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.muted, .hint { color: var(--c-text-3); }
.hint { font-size: var(--fs-sm); margin-block: var(--s-1) 0; }
.num { font-family: var(--f-num); font-variant-numeric: tabular-nums lining-nums; direction: ltr; unicode-bidi: isolate; white-space: nowrap; }
.col-num, .col-num .num { text-align: end; }
.col-num { text-align: end; }
code.sha { font-size: var(--fs-xs); }

/* shell */
.topbar { display: flex; align-items: center; gap: var(--s-6); block-size: var(--header-h); padding-inline: var(--s-6);
  background: var(--c-surface); border-block-end: 1px solid var(--c-line-subtle); position: sticky; inset-block-start: 0; z-index: 10; }
.brand { display: flex; align-items: baseline; gap: var(--s-3); text-decoration: none; color: var(--c-text); }
.brand-name { font-weight: 600; font-size: var(--fs-md); color: var(--c-primary-600); }
.brand-tag { color: var(--c-text-3); font-size: var(--fs-sm); }
.topnav { display: flex; gap: var(--s-4); flex: 1; }
.topnav a { text-decoration: none; color: var(--c-text-2); }
.topnav a:hover { color: var(--c-primary-600); }
.lang-toggle { margin: 0; }
.page { max-inline-size: 1360px; margin-inline: auto; padding: var(--s-6); }
.page-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); margin-block-end: var(--s-4); }
.step-title { font-size: var(--fs-lg); }
.section-title { margin-block: var(--s-6) var(--s-2); font-size: var(--fs-md); }
.actions { display: flex; gap: var(--s-2); }

/* messages */
.messages { list-style: none; margin: 0 0 var(--s-4); padding: 0; display: grid; gap: var(--s-2); }
.msg { padding: var(--s-2) var(--s-3); border-radius: var(--r-3); border: 1px solid var(--c-line); background: var(--c-surface); }
.msg-success { background: var(--c-success-tint); border-color: var(--c-success); color: var(--c-text); }
.msg-success::before { content: "✓ "; color: var(--c-success); font-weight: 600; }
.msg-warning { background: var(--c-warning-tint); border-color: var(--c-warning-line); color: var(--c-warning); }
.msg-warning::before { content: "⚠ "; }
.msg-error { background: var(--c-danger-tint); border-color: var(--c-danger); color: var(--c-danger); }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; min-block-size: var(--ctl-h); padding-inline: var(--s-4);
  border-radius: var(--r-2); border: 1px solid transparent; font: inherit; font-weight: 500; cursor: pointer; text-decoration: none; }
.btn-primary { background: var(--c-primary-600); color: var(--c-text-inverse); }
.btn-primary:hover { background: var(--c-primary-700); }
.btn-secondary { background: var(--c-surface); color: var(--c-primary-600); border-color: var(--c-primary-600); }
.btn-secondary:hover { background: var(--c-primary-50); }
.btn-quiet { background: transparent; color: var(--c-text-2); }
.btn-quiet:hover { background: var(--c-hover); }
.btn.is-current { background: var(--c-primary-50); color: var(--c-primary-700); }

/* panels, forms */
.panel { background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); padding: var(--s-4); margin-block-end: var(--s-4); }
details.panel > summary { cursor: pointer; font-weight: 600; }
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--s-4); margin-block-start: var(--s-4); }
.field { display: grid; gap: var(--s-1); align-content: start; }
.field label { font-weight: 500; color: var(--c-text-2); font-size: var(--fs-sm); }
input, select { font: inherit; color: var(--c-text); min-block-size: var(--ctl-h); padding-inline: var(--s-2);
  border: 1px solid var(--c-line-strong); border-radius: var(--r-2); background: var(--c-surface); }
input:disabled { background: var(--c-sunken); }
.num-input { text-align: start; }
.has-error input { border-color: var(--c-danger); }
.err { color: var(--c-danger); margin: 0; font-size: var(--fs-sm); }
.err::before { content: "✕ "; }
.form-actions { grid-column: 1 / -1; display: flex; gap: var(--s-2); }

/* grid / table */
.grid { inline-size: 100%; border-collapse: collapse; background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); }
.grid th, .grid td { padding-inline: var(--s-3); block-size: var(--row-h); text-align: start; font-size: var(--fs-sm); border-block-end: 1px solid var(--c-line-subtle); }
.grid thead th { background: var(--c-sunken); color: var(--c-text-2); font-weight: 600; border-block-end: 1px solid var(--c-line); }
.grid th.col-num, .grid td.col-num { text-align: end; }
.grid .row-title { font-weight: 500; }
.grid.selectable tbody tr { cursor: pointer; }
.grid.selectable tbody tr:hover { background: var(--c-hover); }
.grid.selectable tbody tr:focus-visible { outline: var(--focus-ring); outline-offset: -2px; }
.grid tr.pencil { background: var(--pencil-hatch); }
.key-fields { max-inline-size: 420px; }
.kf { display: inline-block; margin-inline-end: var(--s-3); }
.kf-name { color: var(--c-text-3); }

/* badges */
.badge { display: inline-block; padding: 0 var(--s-2); border-radius: var(--r-1); font-size: var(--fs-xs); border: 1px solid var(--c-line); background: var(--c-sunken); color: var(--c-text-2); }
.badge-in_progress, .badge-doc-classified, .badge-doc-extracted { background: var(--c-primary-50); border-color: var(--c-primary-100); color: var(--c-primary-700); }
.badge-complete, .badge-doc-accepted { background: var(--c-success-tint); border-color: var(--c-success); color: var(--c-success); }
.badge-doc-rejected { background: var(--c-danger-tint); border-color: var(--c-danger); color: var(--c-danger); }
.badge-pencil { background: var(--c-surface); border: 1px dashed var(--c-pencil-line); color: var(--c-pencil-text); }
.badge-pencil::before { content: "✎ "; }

/* empty states */
.empty { background: var(--c-surface); border: 1px dashed var(--c-line-strong); border-radius: var(--r-3); padding: var(--s-10) var(--s-6); text-align: center; display: grid; gap: var(--s-2); justify-items: center; }
.empty p { margin: 0; color: var(--c-text-2); max-inline-size: 60ch; }
.empty-inline { color: var(--c-text-3); }

/* workspace head + stepper */
.ws-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-6); margin-block-end: var(--s-4); flex-wrap: wrap; }
.ws-meta { display: flex; flex-wrap: wrap; gap: var(--s-4); margin: var(--s-1) 0 0; color: var(--c-text-2); font-size: var(--fs-sm); }
.stepper { margin-block-end: var(--s-6); }
.stepper ol { list-style: none; margin: 0; padding: 0; display: flex; background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); overflow: hidden; }
.stepper li { flex: 1; border-inline-end: 1px solid var(--c-line-subtle); }
.stepper li:last-child { border-inline-end: 0; }
.stepper a { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3) var(--s-4); text-decoration: none; color: var(--c-text-2); }
.stepper a:hover { background: var(--c-hover); }
.step-n { display: inline-grid; place-items: center; inline-size: 24px; block-size: 24px; border-radius: 50%; border: 1px solid var(--c-line-strong); font-size: var(--fs-xs); }
.stepper .is-past .step-n { background: var(--c-primary-100); border-color: var(--c-primary-500); color: var(--c-primary-700); }
.stepper .is-active { background: var(--c-primary-50); box-shadow: inset 0 -3px 0 var(--c-primary-600); }
.stepper .is-active a { color: var(--c-primary-700); font-weight: 600; }
.stepper .is-active .step-n { background: var(--c-primary-600); border-color: var(--c-primary-600); color: var(--c-text-inverse); }

/* processing */
.processing { min-inline-size: 280px; background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); padding: var(--s-3); display: grid; gap: var(--s-2); }
.proc-line { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.processing progress { inline-size: 100%; block-size: 8px; accent-color: var(--c-primary-600); }
.processing.state-error { border-color: var(--c-danger); background: var(--c-danger-tint); }

/* upload */
.upload { display: grid; gap: var(--s-4); }
.kind-field { max-inline-size: 320px; }
/* Not pencil: a drop target is an empty input, not a provisional value (no hatch, no dashed graphite). */
.dropzone { display: grid; justify-items: center; gap: var(--s-2); padding: var(--s-8); border: 1px solid var(--c-line-strong); border-radius: var(--r-3); background: var(--c-sunken); }
.dropzone.is-over { border-color: var(--c-primary-600); background: var(--c-primary-50); }
.drop-text { margin: 0; font-weight: 500; }
.dropzone p { margin: 0; }
label.btn:focus-within { outline: var(--focus-ring); }

/* documents split */
.split { display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: var(--s-4); align-items: start; }
.split-side { position: sticky; inset-block-start: calc(var(--header-h) + var(--s-4)); background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); padding: var(--s-4); max-block-size: calc(100vh - var(--header-h) - var(--s-8)); overflow: auto; }
.panel-title { font-size: var(--fs-md); margin-block-end: var(--s-2); }
.pencil-note { margin: 0 0 var(--s-3); font-size: var(--fs-sm); color: var(--c-pencil-text); }
.pager { display: flex; gap: var(--s-1); margin: 0 0 var(--s-2); }
.sheet { position: relative; border: 1px solid var(--c-line); border-radius: var(--r-3); overflow: hidden; line-height: 0; }
.sheet img { inline-size: 100%; block-size: auto; display: block; }
/* Source highlight. Red pen is reserved for flagged issues. A provisional (pencil) field gets a dashed
   graphite outline on a warning-tint wash; an accepted (ink) field gets a solid text-colour outline. */
.hl { position: absolute; border: 2px dashed var(--c-pencil-line); background: rgba(255, 242, 209, .55); border-radius: var(--r-1); pointer-events: none; }
.hl.hl-ink { border: 2px solid var(--c-text); }
.field-list { list-style: none; margin: 0; padding: 0; }
.field-list li { border-block-end: 1px solid var(--c-line-subtle); }
.field-list a { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--s-3); padding: var(--s-2) var(--s-2); text-decoration: none; color: var(--c-text); font-size: var(--fs-sm); }
.field-list a:hover { background: var(--c-hover); }
.field-list .is-selected a { background: var(--c-primary-50); border-inline-start: 3px solid var(--c-primary-600); }
.fl-name { color: var(--c-text-3); }
.fl-val { font-weight: 500; }
.qr-part { display: block; font-weight: 400; }
.fl-norm, .fl-conf { font-size: var(--fs-xs); grid-column: 1 / -1; }

@media (max-width: 1100px) { .split { grid-template-columns: 1fr; } .split-side { position: static; max-block-size: none; } }

/* fieldwork (M5): status, chips, ink vs pencil */
.summary-line { display: flex; flex-wrap: wrap; gap: var(--s-4); margin: 0 0 var(--s-2); }
.stat { padding: var(--s-1) var(--s-3); background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); font-size: var(--fs-sm); }
.stat-ok { border-inline-start: 3px solid var(--c-success); }
.stat-warn { border-inline-start: 3px solid var(--c-warning-line); }
.stat-bad { border-inline-start: 3px solid var(--c-danger); }
.badge-ok, .badge-match-matched, .badge-dec-accept { background: var(--c-success-tint); border-color: var(--c-success); color: var(--c-success); }
.badge-bad, .badge-match-unmatched, .badge-match-duplicate_claim, .badge-match-document_missing, .badge-sev-high, .badge-dec-reject { background: var(--c-danger-tint); border-color: var(--c-danger); color: var(--c-danger); }
.badge-match-matched_with_differences, .badge-match-ambiguous, .badge-match-partial, .badge-sev-medium, .badge-dec-note { background: var(--c-warning-tint); border-color: var(--c-warning-line); color: var(--c-warning); }
.badge-sev-low { background: var(--c-sunken); }
.chip { display: inline-block; padding: 0 var(--s-2); margin: 1px var(--s-1) 1px 0; border: 1px solid var(--c-line); border-radius: var(--r-1); background: var(--c-surface); font-size: var(--fs-xs); color: var(--c-text); text-decoration: none; }
.chip-link:hover { background: var(--c-primary-50); }
.chip-missing { border-color: var(--c-danger); background: var(--c-danger-tint); color: var(--c-danger); }
.chip-partial, .chip-supporting { border-style: dashed; border-color: var(--c-pencil-line); background: var(--pencil-hatch); color: var(--c-pencil-text); }
.wrap { white-space: normal; }
.grid td.wrap, .grid th.wrap { padding-block: var(--s-1); block-size: auto; min-block-size: var(--row-h); }
.grid tbody th.row-title, .grid tbody td { vertical-align: top; padding-block: var(--s-1); block-size: auto; }
.grid.compact th, .grid.compact td { block-size: auto; font-size: var(--fs-xs); }
tr.row-flag { box-shadow: inset 3px 0 0 var(--c-danger); }
.ink-box { border: 1px solid var(--c-line); border-inline-start: 3px solid var(--c-text); border-radius: var(--r-2); padding: var(--s-2) var(--s-3); background: var(--c-surface); }
.ink-box p { margin: var(--s-1) 0; }
.pencil-box { border: 1px dashed var(--c-pencil-line); border-radius: var(--r-2); padding: var(--s-2) var(--s-3); background: var(--pencil-hatch); color: var(--c-pencil-text); margin-block: var(--s-3); }
details.pencil-box { margin-block: var(--s-1); padding: var(--s-1) var(--s-2); }
details.pencil-box > summary { cursor: pointer; }
.pencil-box h5 { margin: var(--s-2) 0 var(--s-1); }
.hyp { margin: var(--s-1) 0; padding-inline-start: var(--s-5); }
textarea { font: inherit; color: var(--c-text); inline-size: 100%; padding: var(--s-2); border: 1px solid var(--c-line-strong); border-radius: var(--r-2); background: var(--c-surface); }
textarea.query { background: var(--c-surface); border-style: dashed; border-color: var(--c-pencil-line); }
.has-error textarea { border-color: var(--c-danger); }
.filters { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: end; margin-block: var(--s-3); }
.decision-form fieldset { border: 1px solid var(--c-line); border-radius: var(--r-2); padding: var(--s-3); display: grid; gap: var(--s-2); }
.radios { display: flex; gap: var(--s-4); flex-wrap: wrap; }
.history { list-style: none; margin: 0 0 var(--s-3); padding: 0; display: grid; gap: var(--s-2); }
.evidence { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-1); }
.map-form { margin-block: var(--s-3); }
.exc-detail .panel-title { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
#exc-table tbody tr.is-selected { background: var(--c-primary-50); }

.badge-ai { background: var(--c-surface-2, #eef1f5); color: var(--c-text-2); border: 1px dashed currentColor; }
.badge-ai-anthropic { color: var(--c-accent, #0b5cab); }

/* QA pass: overflow, skip link, table scroll */
.skip-link { position: absolute; inset-inline-start: var(--s-2); inset-block-start: -64px; z-index: 100; padding: var(--s-2) var(--s-4);
  background: var(--c-primary-600); color: var(--c-text-inverse); border-radius: var(--r-2); text-decoration: none; }
.skip-link:focus { inset-block-start: var(--s-2); outline: 2px solid #fff; box-shadow: 0 0 0 4px var(--c-primary-600); }
.table-scroll { overflow-x: auto; max-inline-size: 100%; }
.table-scroll:focus-visible { outline: var(--focus-ring); outline-offset: -2px; }
.ws-client, .step-title, .panel-title, .row-title, .brand-name { overflow-wrap: anywhere; min-inline-size: 0; }
.ws-head > div { min-inline-size: 0; max-inline-size: 100%; }
.err-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-1); }
.split-main { min-inline-size: 0; }
@media (max-width: 640px) {
  .page { padding: var(--s-4); }
  .topbar { padding-inline: var(--s-4); gap: var(--s-3); }
  .brand-tag { display: none; }
  .processing { min-inline-size: 0; inline-size: 100%; }
  .page-head { flex-wrap: wrap; }
  .stepper ol { flex-wrap: wrap; }
  .stepper li { flex: 1 1 33%; }
  .stepper a { padding: var(--s-2) var(--s-3); }
  .split-side { max-inline-size: 100%; }
}

.kv { display: flex; flex-wrap: wrap; gap: var(--space-3, 1rem); margin-block: var(--space-2, .5rem); }
.kv dt { font-size: .8em; color: var(--c-muted, inherit); }
.kv dd { margin: 0; }
.inline-form { display: flex; gap: .5rem; flex-wrap: wrap; }

/* single upload: detection, remove / restore, stale prompt */
.stale-prompt { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); margin-block-end: var(--s-4);
  padding: var(--s-3) var(--s-4); background: var(--c-warning-tint); border: 1px solid var(--c-warning-line); border-inline-start-width: 4px; border-radius: var(--r-3); }
.stale-prompt .hint { margin: 0; color: var(--c-warning); }
.notice { padding: var(--s-2) var(--s-3); border-radius: var(--r-3); border: 1px solid var(--c-warning-line); background: var(--c-warning-tint); color: var(--c-warning); margin-block-end: var(--s-2); }
.notice-list { display: grid; gap: var(--s-1); margin-block-end: var(--s-3); }
.detected { display: grid; gap: 2px; }
.detected-label { color: var(--c-text-3); font-size: var(--fs-xs); }
.kind-badge { justify-self: start; }
.badge-kind-unknown { background: var(--c-warning-tint); border-color: var(--c-warning-line); color: var(--c-warning); }
.file-state { font-size: var(--fs-xs); color: var(--c-text-3); }
.file-state.is-bad { color: var(--c-warning); font-weight: 600; }
.row-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--s-2); }
.kind-change > summary { cursor: pointer; list-style: none; }
.kind-change > summary::-webkit-details-marker { display: none; }
.kind-change form { display: flex; gap: var(--s-2); align-items: center; margin-block-start: var(--s-2); }
.list-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); }
.list-head .section-title { margin-block-end: var(--s-2); }
.btn-danger-quiet { background: transparent; color: var(--c-danger); border-color: transparent; }
.btn-danger-quiet:hover { background: var(--c-danger-tint); }
.btn-danger { background: var(--c-danger); color: var(--c-text-inverse); }
.removed-files { margin-block-start: var(--s-6); }
.removed-files > summary { cursor: pointer; font-weight: 600; padding-block: var(--s-2); }
dialog.confirm { max-inline-size: min(480px, calc(100vw - 2 * var(--s-4))); padding: var(--s-5); border: 1px solid var(--c-line-strong); border-radius: var(--r-4); background: var(--c-surface); color: var(--c-text); }
dialog.confirm::backdrop { background: rgba(23, 33, 43, .45); }
dialog.confirm h3 { font-size: var(--fs-md); margin-block-end: var(--s-2); }
dialog.confirm p { margin-block: 0 var(--s-3); overflow-wrap: anywhere; }
dialog.confirm .dlg-actions { display: flex; justify-content: flex-end; gap: var(--s-2); margin-block-start: var(--s-4); }
@media (max-width: 640px) { .stale-prompt { flex-wrap: wrap; } }

/* document review (FIN-057): bands, edit, actions, strict mode */
.review-fields li { display: flex; align-items: flex-start; gap: var(--s-2); flex-wrap: wrap; }
.review-fields li .fl-main { flex: 1 1 14rem; min-inline-size: 0; }
.review-fields .fl-edit { align-self: center; flex: none; }
.review-fields li.is-low { box-shadow: inset 3px 0 0 var(--c-warning-line); }
.fl-orig { grid-column: 1 / -1; font-size: var(--fs-xs); }
.band { display: inline-block; padding: 0 var(--s-2); border-radius: var(--r-1); font-size: var(--fs-xs); border: 1px solid var(--c-line); }
.band-high { border-color: var(--c-success); color: var(--c-success); background: var(--c-success-tint); }
.band-medium { border-color: var(--c-line-strong); color: var(--c-text-2); background: var(--c-sunken); }
.band-low { border-color: var(--c-warning-line); color: var(--c-warning); background: var(--c-warning-tint); }
.low-flag { color: var(--c-warning); font-weight: 600; font-size: var(--fs-xs); }
.low-flag::before { content: "\26A0\FE0E "; }
.badge-edited { background: var(--c-surface); border-color: var(--c-text); color: var(--c-text); }
.edit-form { display: grid; gap: var(--s-2); padding: var(--s-2); inline-size: 100%; }
.edit-form input { inline-size: 100%; }
.type-line { display: flex; align-items: center; gap: var(--s-2); margin: 0 0 var(--s-2); }
.type-form { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
.type-form select { min-inline-size: 0; flex: 1 1 10rem; }
.review-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--s-2); margin-block-start: var(--s-4); padding-block-start: var(--s-3); border-block-start: 1px solid var(--c-line-subtle); }
.reject-box { flex: 1 1 100%; }
.reject-box > summary { cursor: pointer; list-style: none; display: inline-flex; }
.reject-box > summary::-webkit-details-marker { display: none; }
.reject-box form { display: grid; gap: var(--s-2); margin-block-start: var(--s-2); }
kbd { font-family: var(--f-num); font-size: var(--fs-xs); padding: 0 var(--s-1); margin-inline-start: var(--s-1); border: 1px solid currentColor; border-radius: var(--r-1); }
.ink-note { margin: 0 0 var(--s-3); font-size: var(--fs-sm); color: var(--c-text); }
.reject-note { margin: 0 0 var(--s-3); font-size: var(--fs-sm); color: var(--c-danger); }
.grid tr.is-rejected { color: var(--c-text-3); text-decoration: line-through; text-decoration-color: var(--c-line-strong); }
.review-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); margin-block-end: var(--s-2); flex-wrap: wrap; }
.review-counter { margin: 0; font-size: var(--fs-sm); }
.filter-tabs { display: flex; gap: var(--s-1); flex-wrap: wrap; margin-block-end: var(--s-3); border-block-end: 1px solid var(--c-line-subtle); }
.filter-tabs a { padding: var(--s-2) var(--s-3); text-decoration: none; color: var(--c-text-2); border-block-end: 2px solid transparent; }
.filter-tabs a.is-current { color: var(--c-primary-700); border-block-end-color: var(--c-primary-600); font-weight: 600; }
.strict-box { margin-block-end: var(--s-3); padding: var(--s-2) var(--s-3); background: var(--c-surface); border: 1px solid var(--c-line-subtle); border-radius: var(--r-3); }
.strict-box .check { display: inline-flex; align-items: center; gap: var(--s-2); font-weight: 500; }
.strict-box input[type=checkbox] { min-block-size: 0; }
.chip-await { border-style: dashed; border-color: var(--c-pencil-line); background: var(--pencil-hatch); color: var(--c-pencil-text); }