/* The specialist review page (owner :475). Colours as the earlier review page; the step layouts
   are added below by the step scripts' sections. */
:root {
  --bg: #f7f7f5; --fg: #1d1d1b; --muted: #5f5f5a; --card: #ffffff; --line: #cfcfc8;
  --accent: #1a56b0; --good: #1d7a3a; --bad: #b3261e; --warn: #8a5a00; --warn-bg: #fff3d6;
  --mark: #fff0a8; --inherited-bg: #eef2f8;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #161614; --fg: #ecece8; --muted: #a8a8a0; --card: #222220; --line: #46463f;
    --accent: #7fb0ff; --good: #6fd08a; --bad: #ff8a80; --warn: #ffd27a; --warn-bg: #3a2f10;
    --mark: #5a4b00; --inherited-bg: #232a36;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 16px/1.5 system-ui, sans-serif; }
.bar { display: flex; gap: 1rem; align-items: center; padding: .5rem 1rem; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.bar h1 { font-size: 1.1rem; margin: 0; }
#steps { display: flex; gap: .25rem; flex-wrap: wrap; }
.step { border-radius: 999px; }
.step.current { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.progress, .saved { color: var(--muted); font-size: .9rem; }
.hdr-progress { display: inline-block; width: 120px; height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; vertical-align: middle; }
.hdr-progress span { display: block; height: 100%; background: var(--fg); }
.who { margin-left: auto; color: var(--muted); }
main { padding: 1rem; max-width: 1600px; margin: 0 auto; }
button { font: inherit; padding: .45rem .9rem; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--fg); cursor: pointer; min-height: 40px; }
button:disabled { opacity: .5; cursor: not-allowed; }
button.primary { background: var(--accent); color: var(--bg); border-color: var(--accent); }
button.chosen { outline: 2px solid var(--accent); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
input, select, textarea { font: inherit; color: var(--fg); background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: .35rem .5rem; }
textarea { width: 100%; }
.panel { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 1rem; margin-bottom: 1rem; }
.panel h2 { font-size: 1rem; margin: 0 0 .5rem; }
.actions { display: flex; gap: .75rem; flex-wrap: wrap; margin: .75rem 0; }
.note { color: var(--muted); font-size: .85rem; margin: .15rem 0; }
.status { min-height: 1.5rem; padding: 0 1rem; color: var(--muted); }
.status.error { color: var(--bad); font-weight: 600; }
.final { color: var(--bad); font-weight: 600; }
table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; border-bottom: 1px solid var(--line); padding: .3rem .5rem; vertical-align: top; }
.pageimg img { max-width: 100%; border: 1px solid var(--line); background: #fff; }

/* ---------- review step (specialist-review.js) ---------- */
.rv-sources { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .75rem; }
.rv-viewer { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: .75rem; margin-bottom: 1rem; }
.rv-viewer-bar { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-bottom: .5rem; }
.rv-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: .75rem; color: var(--muted); }
.rv-progress { display: flex; gap: 4px; }
.rv-progress .seg { width: 22px; height: 6px; border-radius: 3px; background: var(--line); }
.rv-progress .seg.seen { background: var(--muted); }
.rv-progress .seg.now { background: var(--fg); }
.rv-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 560px); gap: 2rem; align-items: start; }
@media (max-width: 900px) { .rv-split { grid-template-columns: 1fr; } }
.rv-entry { display: flex; flex-direction: column; gap: .85rem; }
.rv-entry h2 { font-size: 1.6rem; margin: 0; }
.rv-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.1rem; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem .75rem; align-items: start; }
.rv-card.elsewhere { border-color: var(--warn); }
.rv-card.fixed { border-style: dashed; }
.rv-card:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.rv-sentence { margin: 0; font-size: 1.1rem; font-weight: 500; }
.rv-source, .rv-codes, .rv-fixed, .rv-slot { grid-column: 1 / -1; margin: 0; }
.rv-source { font-family: Georgia, serif; font-size: .9rem; color: var(--muted); }
.rv-card.elsewhere .rv-ref { color: var(--warn); }
.rv-ref { font: inherit; font-family: system-ui, sans-serif; font-size: .8rem; min-height: 0; padding: 0 .25rem; border: 0; background: none; color: var(--accent); text-decoration: underline; }
.rv-codes { color: var(--muted); font-size: .85rem; padding-left: 1.1rem; }
.rv-fixed { color: var(--bad); font-weight: 600; }
.rv-reasons { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .5rem; }
.rv-reasons button[aria-pressed="true"] { outline: 2px solid var(--accent); }
.rv-missing { align-self: flex-start; }
.rv-next { align-self: flex-start; min-height: 52px; padding: 0 1.75rem; border-radius: 12px; font-weight: 600; }
.rv-add .ar-page { max-height: 18rem; overflow: auto; border: 1px solid var(--line); padding: .5rem; }
