:root {
  color-scheme: light;
  --bg: #f7f8f5;
  --surface: #ffffff;
  --ink: #1d2321;
  --muted: #69716d;
  --line: #dfe4df;
  --accent: #1f7a68;
  --accent-dark: #15584b;
  --warning: #9a5b1f;
  --danger: #9d3e3e;
  --radius: 8px;
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  min-width: 320px;
}

.topbar {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(14px);
  position: sticky;
  top: 0;
  z-index: 5;
}

.eyebrow {
  margin: 0 0 3px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: 28px;
  line-height: 1.1;
}

h2 {
  margin-bottom: 14px;
  font-size: 13px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.actions {
  display: flex;
  gap: 8px;
}

.button,
button {
  appearance: none;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  border-radius: 6px;
  padding: 8px 11px;
  font: inherit;
  font-weight: 650;
  text-decoration: none;
  cursor: pointer;
}

button.primary {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
}

.layout {
  display: grid;
  grid-template-columns: 280px minmax(360px, 1fr);
  min-height: calc(100svh - 88px);
}

.sidebar,
.inspector {
  padding: 20px;
  border-right: 1px solid var(--line);
}

.inspector {
  border-right: 0;
  border-left: 1px solid var(--line);
  background: #fbfcfa;
}

.sidebar section + section {
  margin-top: 28px;
}

label {
  display: grid;
  gap: 7px;
  margin-bottom: 14px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  padding: 10px 11px;
  font: inherit;
}

textarea {
  min-height: 110px;
  resize: vertical;
}

.workspace {
  padding: 20px 22px;
}

.summary {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.summary p {
  color: var(--muted);
  margin-bottom: 4px;
}

.metric {
  font-size: 34px;
  font-weight: 760;
  line-height: 1;
}

.metric-label {
  color: var(--muted);
  margin-left: 6px;
}

.paper-list {
  display: grid;
}

.paper {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  padding: 16px 10px 16px 8px;
  border-bottom: 1px solid var(--line);
  border-left: 3px solid transparent;
  cursor: pointer;
}

.paper.selected {
  background: #f0f5f3;
  border-left-color: var(--accent);
}

.paper:hover h3 {
  color: var(--accent-dark);
}

.star {
  align-self: start;
  border: 0;
  background: transparent;
  padding: 0 2px;
  font-size: 20px;
  line-height: 1.2;
  color: #c7cdc9;
  cursor: pointer;
}

.star.on {
  color: #e0a52e;
}

.row-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 12px;
}

.status-group {
  display: inline-flex;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
}

.status-btn {
  border: 0;
  border-radius: 0;
  border-left: 1px solid var(--line);
  background: var(--surface);
  color: var(--muted);
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 650;
  text-transform: capitalize;
}

.status-btn:first-child {
  border-left: 0;
}

.status-btn.active {
  color: white;
  background: var(--muted);
}

.status-btn.active.included {
  background: var(--accent);
}

.status-btn.active.excluded {
  background: var(--danger);
}

.status-btn.active.reviewed {
  background: var(--warning);
}

.row-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.score {
  display: inline-block;
  margin-right: 8px;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  vertical-align: middle;
  cursor: help;
}

.score.high {
  color: var(--accent-dark);
  background: #e8f5f1;
  border: 1px solid #9bcfc4;
}

.score.mid {
  color: var(--warning);
  background: #fff7e8;
  border: 1px solid #e6c698;
}

.score.low {
  color: var(--muted);
  background: #f0f1ef;
  border: 1px solid var(--line);
}

.new-badge {
  display: inline-block;
  margin-right: 8px;
  padding: 1px 6px;
  border-radius: 4px;
  background: var(--accent);
  color: white;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  vertical-align: middle;
}

.paper h3 {
  margin-bottom: 7px;
  font-size: 17px;
  line-height: 1.32;
}

.meta,
.abstract,
.query {
  color: var(--muted);
  line-height: 1.55;
}

.abstract {
  margin: 9px 0 0;
  max-width: 78ch;
}

.status {
  align-self: start;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.status.included {
  color: var(--accent-dark);
  border-color: #9bcfc4;
  background: #e8f5f1;
}

.status.excluded {
  color: var(--danger);
  border-color: #e5b4b4;
  background: #fff0f0;
}

.status.reviewed {
  color: var(--warning);
  border-color: #e6c698;
  background: #fff7e8;
}

.query-list {
  display: grid;
  gap: 10px;
}

.query-item {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.query-item p {
  margin-bottom: 4px;
  font-size: 13px;
  line-height: 1.4;
}

.query-item span {
  color: var(--muted);
  font-size: 12px;
}

.empty {
  color: var(--muted);
  line-height: 1.6;
}

.hidden {
  /* !important so a hidden element stays hidden even when its own rule sets a display (e.g.
     .pdf-view/.pdf-toolbar use display:flex and are declared later — without this the toggled
     "hidden" class loses on source order and the PDF renders stacked under the abstract). */
  display: none !important;
}

.detail h3 {
  font-size: 20px;
  line-height: 1.28;
  margin-bottom: 10px;
}

.detail-block {
  margin-top: 20px;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tag {
  border-radius: 999px;
  background: #e7ece8;
  padding: 4px 9px;
  font-size: 12px;
  color: #34423d;
}

/* Reader-profile selectable chips (settings 📖 Reader): scope = multi-select, stage = single-select,
   specialty = quick-fill suggestions. Selected = teal (app accent, aligned with the ⑩ active rail). */
.rchips { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 4px; }
.rchip {
  border: 1px solid #cbd5e1; background: #fff; color: #334155; border-radius: 999px;
  padding: 5px 12px; font-size: 13px; line-height: 1.2; cursor: pointer; user-select: none;
}
.rchip:hover { border-color: #94a3b8; }
.rchip.sel { background: #0f766e; border-color: #0f766e; color: #fff; }
.rchip-sug { border-style: dashed; } /* a quick-fill suggestion, not a committed selection */

/* Phase 2 safety floor — a distinct, always-present safety section (amber rail = mandatory governance). */
.synth-floor { margin: 10px 0; padding: 8px 12px; border-left: 3px solid #d97706; background: #fffbeb; border-radius: 4px; }
.synth-floor h4 { margin: 0 0 6px; }
.floor-dim { margin: 6px 0; }
.floor-find { margin: 2px 0 2px 12px; font-size: 13px; color: #334155; }

/* Phase 3 role-view overlay — display-only reorder/highlight of the brief by reader profile. */
.rv-note { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between;
  font-size: 12px; color: #475569; background: #f0f9ff; border-left: 3px solid #0369a1; border-radius: 4px; padding: 5px 10px; margin: 0 0 6px; }
.rv-toggle { font-size: 12px; color: #475569; white-space: nowrap; cursor: pointer; }
.brief-line.rv-fg { border-left: 3px solid #0369a1; padding-left: 8px; background: #f0f9ff; } /* foregrounded = matches reader role */

label.checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 650;
}

label.checkbox input {
  width: auto;
}

.hint {
  margin: -6px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.hint.warn {
  color: var(--danger);
}

.shortcuts {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}

kbd {
  display: inline-block;
  min-width: 16px;
  padding: 1px 5px;
  border: 1px solid var(--line);
  border-bottom-width: 2px;
  border-radius: 4px;
  background: var(--surface);
  color: var(--ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  text-align: center;
}

.detail-head {
  display: flex;
  align-items: start;
  gap: 8px;
}

.detail-head .star {
  font-size: 22px;
}

.quick-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: -6px 0 14px;
}

.qtag {
  border: 1px dashed var(--line);
  background: var(--surface);
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
}

.qtag:hover {
  border-style: solid;
  border-color: var(--accent);
  color: var(--accent-dark);
}

/* --- Scout admin page --- */
.scout {
  max-width: 920px;
  margin: 0 auto;
  padding: 24px;
  display: grid;
  gap: 20px;
}

.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 20px;
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.panel-head h2 {
  margin-bottom: 0;
}

.field-row {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px;
}

.field-row label {
  flex: 1;
  min-width: 140px;
  margin-bottom: 0;
}

.checkbox.inline {
  margin-bottom: 0;
}

code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
  background: #f0f1ef;
  padding: 1px 5px;
  border-radius: 4px;
}

.scout-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.scout-bar-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

.scout-bar .primary {
  font-size: 15px;
  padding: 10px 16px;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 14px;
  margin-top: 4px;
}

.wl-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.wl-card.disabled {
  opacity: 0.62;
}

.wl-card-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 8px;
}

.wl-card-head h3 {
  margin: 0;
  font-size: 16px;
  line-height: 1.3;
}

.wl-card-badges {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

.wl-tag {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 1px 5px;
}

.wl-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 7px; vertical-align: middle; }
.wl-dot-ok { background: var(--accent); }
.wl-dot-bad { background: var(--danger); }
.wl-dot-idle { background: var(--line); }
.wl-stats { color: var(--muted); font-size: 12.5px; display: flex; flex-wrap: wrap; gap: 5px; align-items: baseline; }
.wl-stats b { color: var(--ink); font-size: 14px; }
.wl-stat-sep { opacity: 0.5; }
.wl-query-d > summary { cursor: pointer; color: var(--muted); font-size: 12px; user-select: none; list-style-position: inside; }
.wl-query-d > summary:hover { color: var(--accent); }
.wl-query {
  display: block;
  white-space: normal;
  word-break: break-word;
  line-height: 1.4;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11.5px;
  background: #f6f7f4;
  padding: 8px 10px;
  border-radius: 6px;
}

.wl-card-meta {
  color: var(--muted);
  font-size: 12px;
}

.wl-card-error {
  color: var(--danger);
  font-size: 12px;
}

.wl-card-warn {
  color: #9a6a00;
  font-size: 12px;
}

.wl-card-result {
  font-size: 13px;
  padding: 7px 9px;
  border-radius: 6px;
  background: #f6f7f5;
}

.wl-card-result .r-ok {
  color: var(--accent-dark);
}

.wl-card-result .r-err {
  color: var(--danger);
}
/* 片0 honest coverage line: muted breakdown, gaps (未抓取/已抓未審) called out in amber. */
.wl-card-result .r-coverage {
  margin-top: 3px;
  font-size: 12px;
  color: var(--muted, #64748b);
}
.wl-card-result .r-coverage .r-gap {
  color: #b45309;
  font-weight: 600;
}

.wl-card-actions {
  display: flex;
  gap: 6px;
  margin-top: auto;
  padding-top: 4px;
}

.wl-card-actions .primary {
  flex: 1;
}

.gen-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: -6px 0 14px;
  flex-wrap: wrap;
}

dialog h4 {
  margin: 18px 0 10px;
  font-size: 13px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

dialog {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  width: min(560px, 92vw);
}

dialog::backdrop {
  background: rgba(20, 30, 28, 0.4);
}

dialog h3 {
  margin-bottom: 16px;
}

/* Inside dialogs the sidebar's negative-margin .hint causes overlap; reset it. */
dialog .field-row {
  margin-bottom: 10px;
}

dialog .hint {
  margin: 8px 0 0;
}

.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}

@media (max-width: 1120px) {
  .layout {
    grid-template-columns: 260px 1fr;
  }

  .inspector {
    grid-column: 1 / -1;
    border-left: 0;
    border-top: 1px solid var(--line);
  }
}

@media (max-width: 760px) {
  .topbar {
    align-items: flex-start;
    flex-direction: column;
    position: static;
  }

  .layout {
    display: block;
  }

  .sidebar,
  .workspace,
  .inspector {
    border: 0;
    border-bottom: 1px solid var(--line);
  }

  .paper {
    grid-template-columns: 1fr;
  }
}

/* --- Reading view (System 2) --- */
.reading {
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr) 360px;
  min-height: calc(100svh - 88px);
}

/* Ledger-wide: collapse the under-used Review column and hand that room to the Claim Ledger.
   Toggled by the ⤢ control in the claims column; state persisted in localStorage.
   Desktop-only — the mobile @media below resets .reading back to one column. */
.reading.ledger-wide {
  grid-template-columns: minmax(440px, 0.95fr) minmax(0, 1.55fr);
}
.reading.ledger-wide .reading-side { display: none; }

/* ⤢ (layout) and A−/A/A+ (text size) sit on one bar but are deliberately decoupled:
   "wide" ≠ "big". ⤢ collapses Review; the stepper drives --prose-scale (below). */
.reading-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.ledger-wide-toggle {
  font-size: 12px;
  padding: 3px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
}
.ledger-wide-toggle:hover { background: #f0f4f1; }
.reading.ledger-wide .ledger-wide-toggle {
  background: #e3f1ec;
  color: var(--accent-dark);
  border-color: var(--accent);
}
/* Font stepper: discrete A− / A (reset) / A+ steps. The glyph sizes preview the effect. */
.font-stepper {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  overflow: hidden;
  background: #fff;
}
.font-stepper button {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 2px 10px;
  font-weight: 600;
  line-height: 1.4;
}
.font-stepper button + button { border-left: 1px solid var(--line); }
.font-stepper button:hover:not(:disabled) { background: #f0f4f1; color: var(--ink); }
.font-stepper button:disabled { opacity: 0.35; cursor: default; }
.font-stepper #fontDown { font-size: 11px; }
.font-stepper #fontReset { font-size: 13px; }
.font-stepper #fontUp { font-size: 15px; }

/* C — Claim Ledger as a dedicated column next to the PDF (sticky, scrolls on its own). */
.reading-claims {
  /* Two-tier type scale (honesty doctrine in CSS): --prose-scale is user-controlled by the
     A−/A/A+ stepper (set inline from paper.js, persisted globally). Evidence (source quotes,
     numbers) grows only half as fast and is clamped, so verification text can never shrink
     below readable or balloon into noise — see .claim-quote below. */
  --prose-scale: 1;
  --evidence-scale: calc(1 + (var(--prose-scale) - 1) * 0.5);
  padding: 18px;
  background: #fbfcfa;
  border-right: 1px solid var(--line);
  position: sticky;
  top: 0;
  align-self: start;
  max-height: calc(100svh - 88px);
  overflow: auto;
}

.reading-main {
  border-right: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.file-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  position: sticky;
  top: 0;
  z-index: 2;
}

.file-tab {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 6px;
  padding: 5px 10px;
  font-size: 13px;
  font-weight: 600;
}

.file-tab.active {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
}
/* "＋ PDF" upload affordance in the tab bar — dashed + accent so it reads as "add", not a file. */
.file-add {
  border-style: dashed;
  color: var(--accent-dark);
  cursor: pointer;
}
.file-add:hover { background: #eef4f1; }
/* Compact PMC free-full-text chip, inline in the file-tab bar (no extra row). Green so it reads as
   "free to read", click-through to PMC (they block programmatic download). */
.pmc-chip {
  background: #eaf3ef;
  border-color: var(--accent);
  color: var(--accent-dark);
  text-decoration: none;
  white-space: nowrap;
}
.pmc-chip:hover { background: #d8ebe2; }

.file-del {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 0 4px;
}

.viewer {
  flex: 1;
  overflow: auto;
  padding: 22px;
  background: #f1f3f0;
}

.abstract-view {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 26px 30px;
  max-width: var(--abs-measure, 72ch); /* reading width — user-controlled (窄/中/寬/滿) */
  margin-inline: auto; /* centre the reading column (matches the centred PDF); balances the gutters */
}
/* Abstract reading controls (font size + width), on the abstract itself. */
.abs-title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.abs-tools { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; }
.abs-tool {
  font-size: 12px;
  font-weight: 700;
  min-width: 30px;
  padding: 2px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
}
.abs-tool:hover { background: #eef4f1; }
.abs-tool:disabled { opacity: 0.4; cursor: default; }
/* C2 逐句對照: English verbatim + full size (authoritative), Chinese a quieter line beneath. */
.abs-bi { display: flex; flex-direction: column; gap: 14px; }
.abs-bi-pair { border-left: 2px solid var(--line); padding-left: 12px; }
.abs-bi-en { margin: 0; font-size: calc(15px * var(--prose-scale, 1)); line-height: 1.6; color: #243832; }
.abs-bi-zh { margin: 3px 0 0; font-size: calc(14px * var(--prose-scale, 1)); line-height: 1.6; color: var(--accent-dark); }
.abs-bi-flag {
  margin-left: 8px;
  font-size: 11px;
  font-weight: 700;
  color: #b4534b;
  border: 1px solid #e3b7b2;
  border-radius: 999px;
  padding: 0 7px;
  white-space: nowrap;
}
/* Structured abstract: each labelled section gets a bilingual mini-heading; body in a relaxed
   reading rhythm. Scales with the A−/A/A+ stepper (--prose-scale set on .abstract-view). */
.abs-structured { display: flex; flex-direction: column; gap: 16px; }
.abs-section { display: block; }
.abs-h { display: flex; align-items: baseline; gap: 8px; margin: 0 0 3px; }
.abs-h-zh {
  font-size: calc(13px * var(--prose-scale, 1));
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--accent-dark);
}
.abs-h-en { font-size: calc(11px * var(--prose-scale, 1)); font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.abs-body, .abstract {
  margin: 0;
  font-size: calc(15px * var(--prose-scale, 1));
  line-height: 1.72;
  color: #243832; /* deep slate-green, easier on the eye than pure black */
}
.abstract { max-width: 72ch; }
/* "Read carefully" highlight (zero AI). Caution = dotted underline (a SHAPE cue, not colour-only →
   colour-blind safe) on the negation/direction/equivalence words clinicians misread. Numbers/stats
   get a quiet weight bump, not a loud background. */
.abs-caution {
  border-bottom: 1.5px dotted #c2891f;
  cursor: help;
}
.abs-num { font-weight: 700; color: var(--accent-dark); }
/* 中文 glossary toggle + term·中文 table (term-level only; English remains authoritative). */
.abs-zh-btn {
  font-size: 12px;
  font-weight: 700;
  padding: 2px 12px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  background: var(--surface);
  color: var(--accent-dark);
  cursor: pointer;
  vertical-align: middle;
  margin-left: 8px;
}
.abs-zh-btn:hover { background: #eef4f1; }
.abs-zh-btn.on { background: var(--accent); color: #fff; }
.abs-gloss-box { margin-top: 16px; border-top: 1px dashed var(--line); padding-top: 12px; }
.abs-gloss-head { font-size: 12px; font-weight: 700; color: var(--muted); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.abs-gloss-note { font-weight: 500; color: var(--muted); font-size: 11px; }
.abs-gloss-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 18px; }
.abs-gloss-row { display: flex; justify-content: space-between; gap: 10px; font-size: calc(13px * var(--prose-scale, 1)); padding: 3px 0; border-bottom: 1px solid #eef1ee; }
.abs-gloss-en { color: var(--ink); }
.abs-gloss-zh { color: var(--accent-dark); font-weight: 600; text-align: right; }
.abs-gloss-hint { font-size: 12px; color: var(--muted); }
.abs-gloss-hint.warn { color: #b4534b; }
@media (max-width: 620px) { .abs-gloss-grid { grid-template-columns: 1fr; } }

.pdf-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

/* PDF toolbar — floating overlay pill pinned to the viewport bottom (stays put while the page
   scrolls), centred horizontally so it sits over the PDF (centre) column rather than down in the
   far bottom-left corner under the reading panel. */
.pdf-toolbar {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 5px 10px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--line);
  border-radius: 999px;
  box-shadow: 0 3px 14px rgba(20, 30, 28, 0.22);
  backdrop-filter: blur(4px);
}
.pdf-toolbar:hover {
  background: rgba(255, 255, 255, 0.99);
}
.pdf-tb-group {
  display: flex;
  gap: 4px;
  align-items: center;
}
.pdf-toolbar button {
  min-width: 26px;
  padding: 2px 7px;
  cursor: pointer;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
#pdfHome svg {
  display: block;
}
.pdf-tb-label {
  font-size: 12px;
  color: var(--muted, #667);
  min-width: 30px;
  text-align: center;
}
#pageInput {
  width: 44px;
  text-align: center;
  /* Hide the native number spinner — it stole the width and clipped the digits. */
  appearance: textfield;
  -moz-appearance: textfield;
}
#pageInput::-webkit-outer-spin-button,
#pageInput::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Page container: positioning context for the text layer overlay */
.pdf-page-wrap {
  position: relative;
  box-shadow: 0 1px 6px rgba(20, 30, 28, 0.15);
  background: white;
}
.pdf-canvas {
  display: block;
}

/* pdf.js text layer — transparent, selectable text aligned over the canvas */
.textLayer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  line-height: 1;
  text-size-adjust: none;
  forced-color-adjust: none;
}
.textLayer span,
.textLayer br {
  position: absolute;
  white-space: pre;
  color: transparent;
  transform-origin: 0 0;
  cursor: text;
}
.textLayer span::selection {
  background: rgba(120, 170, 255, 0.45);
}

/* pdf.js annotation (link) layer — overlays the text layer; only the link boxes capture clicks, so
   text selection + claim highlighting pass through everywhere else. DOI/URL links open new tabs;
   reference links jump within the PDF (see pdfLinkService). */
.annotationLayer {
  position: absolute;
  inset: 0;
  transform-origin: 0 0;
  pointer-events: none;
}
.annotationLayer section {
  position: absolute;
  pointer-events: auto;
}
.annotationLayer .linkAnnotation > a {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 2px;
}
/* faint affordance so a clinician can SEE a link is there (publisher PDFs draw none) */
.annotationLayer .linkAnnotation > a:hover {
  background: rgba(120, 170, 255, 0.22);
  box-shadow: 0 0 0 1px rgba(90, 140, 230, 0.5);
}

.reading-side {
  padding: 18px;
  overflow: auto;
  background: #fbfcfa;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.side-meta .meta {
  margin: 0 0 4px;
}

.side-section {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
  background: var(--surface);
}

.side-section > summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 10px;
}

.side-section[open] > summary {
  margin-bottom: 12px;
}

.collection-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.tag-x {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 0 2px;
  font-weight: 700;
}

.side-save {
  position: sticky;
  bottom: 0;
  background: #fbfcfa;
  border-top: 1px solid var(--line);
  padding-top: 12px;
  display: grid;
  gap: 8px;
}

@media (max-width: 1100px) {
  .reading,
  .reading.ledger-wide {
    grid-template-columns: 1fr;
  }
  /* On a phone the layout is already one column — keep Review visible, the toggle is a no-op */
  .reading.ledger-wide .reading-side { display: flex; }
  .reading-main {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .reading-claims {
    position: static;
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}

.ai-mark {
  font-size: 9px;
  font-weight: 800;
  color: var(--accent);
  vertical-align: super;
}

/* --- Archive facets --- */
.facet-group {
  margin-top: 22px;
}

.facet-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
}

.facet {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  padding: 5px 8px;
  border-radius: 6px;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}

.facet:hover {
  background: #eef1ee;
}

.facet.active {
  background: var(--accent);
  color: white;
}

.facet-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.facet-count {
  flex-shrink: 0;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
}

.facet.active .facet-count {
  color: #d6efe8;
}

.active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.filter-chip {
  background: #e7ece8;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  color: #34423d;
  cursor: pointer;
}

.guide-box {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

.guide-meta {
  font-size: 11px;
  color: var(--muted);
}

/* Per-model switcher chips (A/B compare the same paper across models). */
.guide-models {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 6px 0 2px;
}
.guide-models:empty { display: none; }
.guide-models .gm-label {
  font-size: 11px;
  color: var(--muted);
  margin-right: 2px;
}
.model-chip {
  font-size: 11px;
  padding: 2px 8px;
  border: 1px solid var(--border, #cbd5e1);
  border-radius: 999px;
  background: transparent;
  color: var(--text, #334155);
  cursor: pointer;
  line-height: 1.5;
}
.model-chip:hover { border-color: var(--accent, #2563eb); }
.model-chip.active {
  background: var(--accent, #2563eb);
  border-color: var(--accent, #2563eb);
  color: #fff;
  cursor: default;
}

.guide-content {
  min-height: 220px;
  font-size: 13px;
  line-height: 1.5;
}

/* --- Claim Ledger (主軸 A) --- */
.claim-source {
  font-size: 11px;
  color: var(--muted);
}
.claim-ledger {
  display: grid;
  gap: 10px;
}
.claim-sec h5 {
  margin: 4px 0 2px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
/* D — trust grouping: each band headed by its source-verification state. */
.claim-grp { display: grid; gap: 10px; margin-bottom: 18px; }
.claim-grp h5 {
  margin: 8px 0 4px;
  font-size: 12px;
  font-weight: 700;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--line);
}
.claim-grp-solid h5   { color: var(--accent-dark); }
.claim-grp-caveat h5  { color: var(--warning); }
.claim-grp-caution h5 { color: var(--danger); }
/* Each actionability band tints its claim cards (left accent bar + faint wash) so the triage
   state is carried by colour, not just the header — and so stacked claims read as separate
   cards instead of one squeezed block. Tints kept faint to stay scannable. */
.claim-grp-solid .claim   { border-left-color: var(--accent);  background: #f4faf7; }
.claim-grp-caveat .claim  { border-left-color: var(--warning); background: #fcf7ee; }
.claim-grp-caution .claim { border-left-color: var(--danger);  background: #fcf2f2; }
/* Rule-based triage disclaimer — honesty: grouping is computed, not a clinical judgement. */
.ledger-triage-note {
  margin: 0 0 10px;
  font-size: 11px;
  font-style: italic;
  color: var(--muted);
}
.claim-sec-tag {
  font-size: 10px;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 6px;
  flex: none;
}
.claim {
  border: 1px solid var(--line);
  border-left: 3px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  padding: 8px 11px;
  display: grid;
  gap: 5px;
  box-shadow: 0 1px 2px rgba(20, 30, 28, 0.04);
}
.claim:hover { box-shadow: 0 2px 7px rgba(20, 30, 28, 0.1); }
.claim-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  font-size: calc(14px * var(--prose-scale, 1));
  line-height: 1.5;
}
.claim-val {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--accent-dark);
}
.q-badge {
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 999px;
  white-space: nowrap;
  flex: none;
}
.q-badge.q-ok { background: #e3f1ec; color: var(--accent-dark); }
.q-badge.q-approx { background: #f3ead9; color: var(--warning); }
.q-badge.q-none { background: #f3e3e3; color: var(--danger); }
/* Evidence-substrate badge (AI-perceived claim basis) — quiet/neutral so it informs without
   competing with the trust (q-badge) or actionability colour. */
.sub-badge {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 999px;
  white-space: nowrap;
  flex: none;
  background: #eef1f4;
  color: #4a5560;
  border: 1px solid #dde3e8;
}
/* PubMed authoritative publication-type chip (list) + resolved cross-check (paper review). */
.pubtype-chip {
  display: inline-block;
  font-size: 10px;
  padding: 0 6px;
  border-radius: 999px;
  background: #eaf0f6;
  color: #3a566e;
  border: 1px solid #d2deea;
  white-space: nowrap;
}
.type-resolved {
  margin-left: 6px;
  font-size: 11px;
  color: var(--accent-dark);
}
.type-resolved.conflict { color: var(--danger); font-weight: 600; }
/* Evidence Claimsheet — appraisal facts; grounded values pop, abstained ("—") stay muted. */
.cs-intro { margin: 4px 0 0; line-height: 1.5; }
.cs-fields { display: flex; flex-wrap: wrap; gap: 4px 5px; margin: 8px 0 12px; }
.cs-fields span {
  font-size: 10px;
  color: var(--muted);
  background: #f0f4f1;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 1px 8px;
}
.claimsheet { display: grid; gap: 6px; margin-top: 8px; }
/* Claimsheet text tracks the A−/A/A+ stepper (--prose-scale, set on .reading-claims) like the
   ledger does; the key column scales with it so labels don't get clipped when enlarged. */
.cs-fam { font-size: calc(11px * var(--prose-scale, 1)); color: var(--accent-dark); background: #eaf3ef; border-radius: 6px; padding: 3px 8px; }
.cs-row {
  display: grid;
  grid-template-columns: calc(72px * var(--prose-scale, 1)) 1fr;
  gap: 6px 10px;
  align-items: baseline;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: 6px;
  background: #f4faf7;
  font-size: calc(12px * var(--prose-scale, 1));
}
.cs-row.cs-unclear { border-left-color: var(--line); background: var(--surface); }
.cs-key { color: var(--muted); font-size: calc(11px * var(--prose-scale, 1)); }
.cs-val { font-weight: 600; color: var(--ink); }
.cs-row.cs-unclear .cs-val { color: var(--muted); font-weight: 400; }
.cs-quote {
  grid-column: 2;
  font-size: calc(11px * var(--prose-scale, 1));
  font-style: italic;
  color: var(--muted);
  border-left: 2px solid var(--line);
  padding-left: 6px;
}
/* Translational-overreach flag — rule-derived, the loudest caveat (clinical claim on
   preclinical evidence). Stronger than a normal caveat-chip. */
.overreach-chip {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #f7e0df;
  color: var(--danger);
  border: 1px solid #e6b8b6;
  font-weight: 600;
}
/* Attribution (server-derived): cited prior work, not this paper's claim. Neutral/info, not alarm. */
.cited-chip {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #eef0f4;
  color: #4a5365;
  border: 1px solid #d3d8e2;
  font-weight: 600;
}
.claim-sec-tag.claim-sec-cited { background: #eef0f4; color: #4a5365; }
.claim-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.risk-flag {
  font-size: 10px;
  padding: 1px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
}
.claim-quote {
  margin: 2px 0 0;
  padding: 3px 8px;
  border-left: 2px solid var(--line);
  /* Evidence tier: clamped — floor 12px (never below readable), ceiling 16px (never noise). */
  font-size: clamp(12px, calc(12px * var(--evidence-scale, 1)), 16px);
  color: var(--muted);
  font-style: italic;
}
.guide-edit > summary {
  font-size: 11px;
  color: var(--muted);
  cursor: pointer;
}
.claim-jump {
  font-size: 10px;
  padding: 1px 6px;
  border: 1px solid var(--accent);
  color: var(--accent-dark);
  background: transparent;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
}
.claim-jump:hover { background: #e3f1ec; }
.claim-drill {
  font-size: 10px;
  padding: 1px 6px;
  border: 1px solid var(--line);
  color: var(--muted);
  background: transparent;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
}
.claim-drill:hover { background: #eef1ee; color: var(--ink); }
/* Loading spinner shown while a guide/layer is being generated (Claude can take a few seconds). */
.spinner {
  display: inline-block;
  width: 11px;
  height: 11px;
  border: 2px solid var(--line);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: pml-spin 0.7s linear infinite;
  vertical-align: -1px;
  margin-right: 6px;
}
@keyframes pml-spin { to { transform: rotate(360deg); } }
.gen-row button:disabled { opacity: 0.55; cursor: progress; }

/* ── Center "generating guide" modal ─────────────────────────────────────────
   Driven by generateGuide() (paper.js): shows on a short delay so instant cache
   hits never flash, mirrors the same progress text as #guideState, and is hidden
   in that function's finally block so it always closes — on done, error or cancel. */
.guide-overlay {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(20, 30, 28, 0.28);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}
.guide-overlay.show { opacity: 1; pointer-events: auto; }
.guide-overlay-card {
  width: min(340px, 86vw);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 18px 50px rgba(20, 30, 28, 0.22);
  padding: 26px 26px 22px;
  text-align: center;
  transform: translateY(8px) scale(0.97);
  transition: transform 0.22s ease;
}
.guide-overlay.show .guide-overlay-card { transform: translateY(0) scale(1); }
/* Three-dot "thinking" bounce — calmer than a hard-spinning ring at this size. */
.guide-overlay-dots { display: flex; justify-content: center; gap: 7px; margin-bottom: 16px; }
.guide-overlay-dots span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--accent);
  animation: guide-dot 1.1s ease-in-out infinite;
}
.guide-overlay-dots span:nth-child(2) { animation-delay: 0.16s; }
.guide-overlay-dots span:nth-child(3) { animation-delay: 0.32s; }
@keyframes guide-dot {
  0%, 80%, 100% { transform: scale(0.55); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}
.guide-overlay-msg {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.5;
  min-height: 21px;
}
/* Indeterminate sweep — we can't get a real % from the API, so this is an honest
   "still working" signal, not a faked progress estimate. */
.guide-overlay-bar {
  margin: 14px auto 0;
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: var(--line);
  overflow: hidden;
}
.guide-overlay-bar-fill {
  width: 40%;
  height: 100%;
  border-radius: 999px;
  background: var(--accent);
  animation: guide-sweep 1.3s ease-in-out infinite;
}
@keyframes guide-sweep {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(320%); }
}
.guide-overlay-hint { margin-top: 12px; font-size: 11px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) {
  .guide-overlay-dots span,
  .guide-overlay-bar-fill { animation: none; }
  .guide-overlay-bar-fill { width: 100%; opacity: 0.6; }
}

/* ── Reusable inline AI-pending indicators (the "inline / 區塊內" tier of the AI-loading
   standard — animated but NOT a blocking modal). .ai-dots = a small "thinking" pulse inside
   status text; .ai-shimmer = a sweeping skeleton glow on the result/placeholder box itself.
   Shared across pages via styles.css so same-tier spots reuse one renderer, not copy-paste. */
.ai-dots { display: inline-flex; gap: 4px; margin-right: 7px; vertical-align: 1px; }
.ai-dots i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--accent);
  animation: ai-dot 1.1s ease-in-out infinite;
}
.ai-dots i:nth-child(2) { animation-delay: 0.16s; }
.ai-dots i:nth-child(3) { animation-delay: 0.32s; }
@keyframes ai-dot {
  0%, 80%, 100% { transform: scale(0.5); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}
.ai-shimmer { position: relative; overflow: hidden; }
.ai-shimmer::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 20%, rgba(31, 122, 104, 0.10) 50%, transparent 80%);
  transform: translateX(-100%);
  animation: ai-shimmer-sweep 1.4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes ai-shimmer-sweep { to { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) {
  .ai-dots i { animation: none; opacity: 0.7; }
  .ai-shimmer::after { animation: none; }
}
.claim-deeper {
  font-size: 10px;
  padding: 1px 6px;
  border: 1px dashed var(--line);
  color: var(--muted);
  background: transparent;
  border-radius: 999px;
  cursor: pointer;
  margin-top: 2px;
}
.claim-deeper:hover { background: #eef1ee; color: var(--ink); }
.layer-slot { display: grid; gap: 6px; }
.clause-jump {
  font-size: 10px;
  padding: 0 5px;
  border: 1px solid var(--accent);
  color: var(--accent-dark);
  background: transparent;
  border-radius: 999px;
  cursor: pointer;
  margin-left: 4px;
}
.clause-jump:hover { background: #e3f1ec; }
/* Rule-based safety caveats (deterministic, not AI) */
.claim-caveats { display: flex; flex-wrap: wrap; gap: 4px; }
.caveat-chip {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #f3ead9;
  color: var(--warning);
}
/* Drill layers (AI reading — clearly labeled, not verified) */
.claim-layers { display: grid; gap: 6px; margin-top: 2px; padding-left: 8px; border-left: 2px dashed var(--line); }
.layer-clause { font-size: calc(13.5px * var(--prose-scale, 1)); line-height: 1.55; color: var(--ink); }
.ep-badge {
  font-size: 9px;
  padding: 0 5px;
  border-radius: 999px;
  margin-right: 4px;
  white-space: nowrap;
}
.ep-badge.ep-quoted { background: #e3f1ec; color: var(--accent-dark); }
.ep-badge.ep-interp { background: #ece7f1; color: #5b4b8a; }
.ep-badge.ep-caveat { background: #f3e3e3; color: var(--danger); }
/* Character-precise source highlight: overlay rects drawn from a DOM Range (one per line
   fragment), so partial first/last lines aren't over-painted like whole-span colouring was. */
.claim-hl-rect {
  position: absolute;
  background: rgba(241, 196, 15, 0.4);
  border-radius: 1px;
  pointer-events: none;
  z-index: 1;
}
.anchor-return {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 50;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  font-size: 13px;
}

/* --- Collections page extras --- */
.title-input {
  font-size: 18px;
  font-weight: 700;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 4px 0;
}

.export-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.add-results {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}

.add-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 13px;
}

a.wl-card {
  text-decoration: none;
  color: inherit;
}

/* --- Shared agent grammar (grounded chip / trust tier / stance) + Synthesizer view --- */
.g-chip { border-left: 3px solid #cbd5e1; padding: 6px 10px; margin: 6px 0; background: #f8fafc; border-radius: 4px; }
.g-chip-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-size: 14px; }
.g-chip .claim-text { color: #1e293b; }
.g-chip .claim-quote { margin: 6px 0 0; padding: 4px 8px; border-left: 2px solid #e2e8f0; color: #64748b; font-size: 12px; }
.g-chip .claim-val { color: #0f172a; font-weight: 600; font-variant-numeric: tabular-nums; }
.chip-src { font-size: 12px; color: #2563eb; text-decoration: none; }

.trust-tier { font-size: 11px; padding: 1px 7px; border-radius: 10px; font-weight: 600; }
.tier-verified { background: #dcfce7; color: #166534; }
.tier-synthesis { background: #fef9c3; color: #854d0e; border: 1px dashed #ca8a04; } /* dashed = softer than 附原文✓ */
.tier-unverified { background: #f1f5f9; color: #64748b; }

.stance { font-size: 12px; font-weight: 600; white-space: nowrap; }
.st-sup { color: #15803d; }
.st-opp { color: #b91c1c; }
.st-null { color: #475569; }
.st-nm { color: #94a3b8; }
.st-nc { color: #a16207; }

.synth-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 8px; }
.synth-brief h4, .synth-axes h4, .synth-dim h5 { margin: 12px 0 4px; }
.brief-line { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border-bottom: 1px solid #f1f5f9; font-size: 14px; }
.brief-line .denom { color: #64748b; font-variant-numeric: tabular-nums; font-size: 12px; white-space: nowrap; }
.axis-row { font-size: 13px; padding: 2px 0; color: #334155; }
.synth-dim { margin-top: 10px; }
.synth-dim h5 { color: #0f172a; border-bottom: 1px solid #e2e8f0; padding-bottom: 2px; }
/* Rule-derived gate annotation on a cell (anecdotal exclusion / QC demotion / not-located). Muted,
   distinct from the claim text — the denominator gate's reason, made visible. */
.cell-note { font-size: 12px; color: #92400e; margin: 1px 0 6px 4px; font-style: italic; }
/* Evidence tier by study design (coarse, NOT formal GRADE) — makes "2 supports of cohorts" not read as RCT-strong */
.ev-badge { font-size: 11px; padding: 0 5px; border-radius: 3px; margin-left: 4px; white-space: nowrap; border: 1px solid transparent; }
.ev-badge.ev-high { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.ev-badge.ev-mod  { background: #fef9c3; color: #854d0e; border-color: #fde68a; }
.ev-badge.ev-low  { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.ev-badge.ev-anec { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.ev-basis { font-size: 11px; color: #64748b; margin: 2px 0 6px 4px; }
/* Comparability facets (claim-decomposition §2.1) — server-verified invariants on a cell. A .facet-diff
   pill marks an axis on which the conflicting papers differ (the not-comparable signal). Visually a third
   register, distinct from the AI-interpreted axis and the rule-based gate note. */
.facet-row { display: flex; flex-wrap: wrap; gap: 4px; margin: 2px 0 6px 4px; }
.facet-pill { font-size: 11px; padding: 0 6px; border-radius: 10px; background: #eff6ff; color: #1e40af; border: 1px solid #dbeafe; white-space: nowrap; }
.facet-pill .facet-k { color: #64748b; font-weight: 600; margin-right: 2px; }
.facet-pill.facet-diff { background: #fef2f2; color: #9f1239; border-color: #fecdd3; }
.facet-pill.facet-diff .facet-k { color: #be123c; }
.facet-split-trace { margin: 4px 0; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }

/* Adjudication cockpit (§4) — HUMAN side-by-side verdict capture + the Decision Ledger (✍人工裁決). A
   third provenance register, visually distinct from rule denominators and AI axes. */
.adj-ledger { margin: 10px 0; padding: 8px 10px; border: 1px solid #e9d5ff; border-radius: 8px; background: #faf5ff; }
.adj-ledger > h4 { margin: 0 0 6px; font-size: 14px; color: #6b21a8; }
.adj-row { padding: 6px 0; border-top: 1px solid #f3e8ff; }
.adj-row:first-of-type { border-top: 0; }
.adj-line1 { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.adj-pen { font-size: 11px; color: #7c3aed; background: #f3e8ff; border: 1px solid #e9d5ff; border-radius: 4px; padding: 0 5px; }
.adj-verdict { font-size: 12px; font-weight: 600; color: #6b21a8; }
.adj-stale { font-size: 11px; color: #b45309; background: #fef3c7; border-radius: 4px; padding: 0 5px; }
.adj-note { font-size: 13px; color: #1e293b; margin: 3px 0 1px 2px; }
.adj-meta { font-size: 11px; }
.adj-del { font-size: 11px; margin-left: auto; background: #fff; border: 1px solid #e2e8f0; border-radius: 4px; cursor: pointer; color: #64748b; }
.adj-del:hover { border-color: #fca5a5; color: #b91c1c; }

.adj-cockpit:empty { display: none; }
.adj-panel { margin-top: 8px; border: 1px solid #d8b4fe; border-radius: 8px; padding: 10px; background: #fdfaff; }
.adj-panel-head { font-size: 13px; margin-bottom: 8px; color: #6b21a8; }
.adj-table { width: 100%; border-collapse: collapse; font-size: 12px; margin-bottom: 8px; }
.adj-table th, .adj-table td { border: 1px solid #ede9fe; padding: 4px 6px; text-align: left; vertical-align: top; }
.adj-table thead th { background: #f5f3ff; color: #4c1d95; }
.adj-th-sub { margin-top: 2px; }
.adj-facet-k { background: #faf5ff; color: #6b21a8; white-space: nowrap; font-weight: 600; }
.adj-table td.adj-diff { background: #fef2f2; color: #9f1239; font-weight: 600; }
.adj-flag { color: #be123c; }
.adj-claim { font-style: italic; }
.adj-verdicts { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.adj-radio { font-size: 13px; cursor: pointer; }
.adj-field { display: block; font-size: 12px; color: #475569; margin-bottom: 6px; }
.adj-field textarea, .adj-field input, .adj-field select { width: 100%; box-sizing: border-box; margin-top: 2px; font-size: 13px; padding: 4px 6px; border: 1px solid #cbd5e1; border-radius: 4px; }
.adj-field select { width: auto; min-width: 160px; }
.adj-panel-actions { display: flex; gap: 8px; align-items: center; }
.adj-save { background: #7c3aed; color: #fff; border: 0; border-radius: 6px; padding: 5px 12px; cursor: pointer; font-size: 13px; }
.adj-save:hover { background: #6d28d9; }
.adj-cancel { background: #fff; border: 1px solid #e2e8f0; border-radius: 6px; padding: 5px 10px; cursor: pointer; font-size: 13px; }
.gap-adjudicate { background: #f5f3ff; border: 1px solid #d8b4fe; color: #6b21a8; border-radius: 6px; padding: 4px 10px; cursor: pointer; font-size: 13px; }
.gap-adjudicate:hover { background: #ede9fe; }
/* Gap-finder Scout candidate picker (dry-run preview → checkbox-ingest, human relevance gate) */
.cand-box { margin-top: 8px; border: 1px solid #e2e8f0; border-radius: 6px; padding: 8px 10px; background: #f8fafc; }
.cand-head { font-size: 12px; color: #475569; margin-bottom: 6px; }
/* 3 欄對齊：[checkbox] [score] [內容(設計標+標題、下方 meta)]，欄寬固定 → 各列對齊、不論有無設計標。 */
.cand-row { display: grid; grid-template-columns: 18px 44px minmax(0, 1fr); column-gap: 10px; align-items: start; padding: 7px 0; font-size: 13px; border-bottom: 1px solid #eef2f7; }
.cand-row.cand-in { opacity: 0.55; }
.cand-row input { margin-top: 3px; justify-self: center; }
.cand-score { font-variant-numeric: tabular-nums; color: #0369a1; font-size: 12px; text-align: right; padding-top: 1px; }
.cand-main { min-width: 0; }
.cand-title-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.cand-title { font-weight: 600; color: #1d4ed8; }
.cand-meta { margin-top: 2px; }
.cand-design { font-size: 11px; padding: 0 5px; border-radius: 3px; background: #e0e7ff; color: #3730a3; white-space: nowrap; }
/* 低相關（<70%）：預設不勾、摺疊，視覺更輕（誠實：弱相關不該和高相關同權） */
.cand-row.cand-low { opacity: 0.72; }
.cand-row.cand-low .cand-score { color: #b45309; }
.cand-low-fold { margin: 4px 0 2px; }
.cand-low-fold > summary { cursor: pointer; font-size: 12px; color: #94a3b8; padding: 3px 0; }
.cand-low-fold[open] > summary { color: #64748b; }
.cand-add { margin-top: 8px; }

/* Curator public brief (/brief/:id) — reuses synth-* grammar; a few page-local touches */
.brief-share { margin-left: auto; font-size: 12px; }
.brief-header code { background: #f1f5f9; padding: 1px 5px; border-radius: 4px; font-size: 12px; }
.brief-withheld { margin: 2px 0 8px; color: #92400e; }
.synth-matrix > h4, .brief-refs > h4 { margin: 14px 0 6px; }
.brief-refs { margin-top: 16px; border-top: 1px solid #e2e8f0; padding-top: 8px; }
.brief-refs h4 .export-row { margin-left: 10px; display: inline-flex; gap: 6px; }
.brief-ref { padding: 4px 0; font-size: 14px; }
.brief-ref .hint { display: block; font-size: 12px; }

/* Add-to-collection picker in the library list */
.collect-wrap { display: inline-flex; align-items: center; gap: 4px; }
.collect-btn { font-size: 12px; padding: 2px 8px; border: 1px solid #cbd5e1; background: #fff; border-radius: 4px; cursor: pointer; color: #475569; }
.collect-btn:hover { background: #f1f5f9; }
.collect-pick { font-size: 12px; padding: 2px 4px; max-width: 160px; }

/* Synthesizer chip: quote collapsed by default (click head to drill) */
details.g-chip > summary.g-chip-head { cursor: pointer; list-style: none; }
details.g-chip > summary.g-chip-head::-webkit-details-marker { display: none; }
details.g-chip > summary.g-chip-head::before { content: "▸ "; color: #94a3b8; }
details.g-chip[open] > summary.g-chip-head::before { content: "▾ "; }
details.g-chip[open] { background: #f1f5f9; }
.synth-noise > summary { cursor: pointer; color: #94a3b8; font-size: 12px; margin: 4px 0 2px; }
.synth-noise[open] > summary { color: #64748b; }
/* Relay banner: Synthesizer flags unknown-design papers and offers a one-click send-back to the classifier. */
.synth-relay { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px 10px; margin-bottom: 10px;
  border: 1px solid #f1d4a0; background: #fdf6e9; border-radius: 6px; }
.synth-relay button { cursor: pointer; border: 1px solid #cbd5e1; background: #fff; border-radius: 5px; padding: 3px 9px; font-size: 13px; }
.synth-relay button:disabled { opacity: 0.5; cursor: default; }

/* Gap-finder (role relay 第 7 棒) */
.synth-gaps { margin-top: 0; }

/* Collection = master-detail（左 nav 項目 / 右 stage 內容），沿用 paper 頁 proven 的 .reading 殼但 2 欄。
   無上方 header；全域編輯在左 nav 頂的 ⋯ 選單，單項動作就地在 stage。狀態判定仍來自後端純函式。 */
.scout.coll-main { max-width: none; } /* 全版 detail：不再是 Scout-admin 繼承的 920px */
.coll-detail { grid-template-columns: 300px minmax(0, 1fr); } /* 2 欄（覆蓋 .reading 的 3 欄）：nav + stage */
.coll-detail .reading-main { padding: 18px 22px; border-right: 0; font-size: calc(15px * var(--prose-scale, 1)); }
/* A−/A/A+ 真正生效：stage 內各文字元件本來是固定 px（不會繼承縮放），逐一改成隨 --prose-scale 縮放
   （比照 paper 頁作法）；px 的徽章/facet pill 仍維持原尺寸＝誠實 chrome 不變形。 */
.coll-detail .stage-h { font-size: calc(17px * var(--prose-scale, 1)); }
.coll-detail .brief-line { font-size: calc(14px * var(--prose-scale, 1)); }
.coll-detail .brief-line .denom { font-size: calc(12px * var(--prose-scale, 1)); }
.coll-detail .axis-row { font-size: calc(13px * var(--prose-scale, 1)); }
.coll-detail .synth-dim h5 { font-size: calc(15px * var(--prose-scale, 1)); }
.coll-detail .g-chip-head { font-size: calc(14px * var(--prose-scale, 1)); }
.coll-detail .g-chip .claim-quote { font-size: calc(12px * var(--prose-scale, 1)); }
.coll-detail .gap-detail { font-size: calc(14px * var(--prose-scale, 1)); }
/* mobile：跟 .reading 一樣塌單欄（我的 .coll-detail 同特異度但在 .reading media query 之後，需自己再塌一次） */
@media (max-width: 1100px) { .coll-detail { grid-template-columns: 1fr; } }

/* 左 nav 頂：標題就地改名 + ⋯ 全域選單 */
.coll-nav-head { position: relative; display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.coll-title-input { flex: 1; min-width: 0; font-size: 16px; font-weight: 700; border: 1px solid transparent; background: transparent; padding: 4px 6px; border-radius: 6px; color: #0f172a; }
.coll-title-input:hover, .coll-title-input:focus { border-color: var(--line); background: #fff; outline: none; }
.coll-menu-btn { border: 1px solid var(--line); background: #fff; border-radius: 6px; cursor: pointer; padding: 2px 9px; font-size: 16px; line-height: 1; color: var(--muted); }
.coll-menu-btn:hover { background: #f1f5f9; }
/* fixed 下拉（相對視窗、不被 nav 的 overflow:auto 裁切、也不推開項目）；位置由 JS 依 ⋯ 按鈕計算。 */
.coll-menu { position: fixed; z-index: 50; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 10px 28px rgba(15,23,42,.16); padding: 4px; min-width: 190px; display: flex; flex-direction: column; }
.coll-menu.hidden { display: none; }
.coll-menu a, .coll-menu button { text-align: left; border: 0; background: transparent; padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; color: #334155; text-decoration: none; }
.coll-menu a:hover, .coll-menu button:hover { background: #f1f5f9; }
.coll-menu button.danger { color: #b91c1c; }

/* 左 nav 項目清單 */
.coll-nav-items { display: flex; flex-direction: column; gap: 2px; }
.coll-nav-item { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: 0; background: transparent; padding: 7px 9px; border-radius: 7px; cursor: pointer; font-size: 14px; color: #334155; }
.coll-nav-item:hover { background: #eef2f6; }
.coll-nav-item.active { background: #e0e7ff; color: #1e3a8a; font-weight: 600; }
.coll-nav-item .nav-glyph { width: 1.3em; text-align: center; flex: none; }
.coll-nav-item .nav-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coll-nav-item .nav-n { color: #94a3b8; font-size: 12px; font-variant-numeric: tabular-nums; }
.coll-nav-item.active .nav-n { color: #3730a3; }

/* 右 stage */
.stage-tools { display: flex; justify-content: flex-end; margin-bottom: 8px; }
/* Stage title is a shared component used on h2 (Settings/Guide) AND h3/h4 (Collections). It must define
   its OWN appearance, not inherit the tag default — global h2 is a muted UPPERCASE eyebrow, so an
   h2.stage-h title was rendering washed-out + force-uppercased. Reset those here so any tag reads as a
   title. No-op for the h3/h4 callers (their UA defaults already match ink/no-transform/bold). */
.stage-h { margin: 0 0 12px; font-size: 17px; color: var(--ink); font-weight: 700; text-transform: none; letter-spacing: 0; }
.stage-empty { padding: 24px 0; }
.stage-empty .primary { margin: 8px 0; }
/* Stage content renders directly into the flex-column #collStage (.reading-main); a bare action <button>
   would otherwise stretch to the full column width (align-items:stretch) and read as a giant green bar
   (e.g. the coverage_only "↻ 重生合成"). Keep stage buttons content-sized and left-aligned. */
.coll-detail #collStage > button { align-self: flex-start; margin: 4px 0; }
.dim-actions { margin: 12px 0 4px; display: flex; align-items: center; gap: 10px; }
.dim-adjudicate { background: #f5f3ff; border: 1px solid #d8b4fe; color: #6b21a8; border-radius: 6px; padding: 5px 12px; cursor: pointer; font-size: 13px; }
.dim-adjudicate:hover { background: #ede9fe; }
.dim-gap-note { margin-top: 8px; }
.add-paper-row { margin-bottom: 8px; }
.synth-dim { scroll-margin-top: 12px; }

/* 研究框架 (PICO + scope) editor */
.frame-form { display: flex; flex-direction: column; gap: 12px; max-width: 640px; margin-top: 4px; }
.frame-row { display: grid; grid-template-columns: 168px 1fr; align-items: center; gap: 10px; }
.frame-row.frame-col { grid-template-columns: 1fr; align-items: stretch; gap: 4px; }
.frame-k { font-size: 13px; font-weight: 600; color: #334155; }
.frame-k .hint { font-weight: 400; }
.frame-row input[type=text], .frame-row textarea { width: 100%; box-sizing: border-box; font-size: 13px; padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-family: inherit; }
.frame-row textarea { resize: vertical; line-height: 1.5; }
.frame-actions { display: flex; align-items: center; gap: 12px; margin-top: 4px; }
@media (max-width: 560px) { .frame-row { grid-template-columns: 1fr; align-items: stretch; gap: 4px; } }
.gap-head h4 { margin: 14px 0 6px; }
.gap-saturated { padding: 6px 10px; margin: 6px 0; border-radius: 6px; background: #f0f9f4; border: 1px solid #cdebd9; color: #166534; font-size: 13px; }
.gap-card { border: 1px solid #e2e8f0; border-left-width: 4px; border-radius: 7px; padding: 9px 11px; margin: 8px 0; background: #fff; }
.gap-card.gap-blocking { border-left-color: #dc2626; background: #fdf3f3; }
.gap-card.gap-sensitivity { border-left-color: #d97706; background: #fdf8ef; }
.gap-card.gap-nice { border-left-color: #94a3b8; }
.gap-card.gap-non { border-left-color: #cbd5e1; }
.gap-card.gap-dim { opacity: 0.55; }
.gap-row1 { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.gap-type { font-weight: 600; color: #0f172a; }
.gap-impact { font-size: 12px; padding: 1px 7px; border-radius: 10px; background: #f1f5f9; color: #475569; }
.gap-card.gap-blocking .gap-impact { background: #fee2e2; color: #b91c1c; }
.gap-card.gap-sensitivity .gap-impact { background: #fef3c7; color: #b45309; }
.gap-status { font-size: 12px; color: #64748b; margin-left: auto; }
.gap-detail { margin: 5px 0; font-size: 13.5px; color: #1e293b; line-height: 1.5; }
.gap-trace > summary { cursor: pointer; color: #94a3b8; font-size: 12px; }
.gap-trace[open] > summary { color: #64748b; }
.gap-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 6px; }
.gap-actions a, .gap-actions button { font-size: 13px; text-decoration: none; cursor: pointer; border: 1px solid #cbd5e1;
  background: #fff; border-radius: 5px; padding: 3px 9px; color: #0f172a; }
.gap-actions a:hover, .gap-actions button:hover { background: #f8fafc; }
.gap-query { font-size: 12px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 4px; padding: 2px 6px; color: #334155; word-break: break-all; }
.gap-msg { margin-top: 4px; }
.gap-resolved > summary { cursor: pointer; color: #64748b; font-size: 13px; margin: 8px 0 4px; }

/* §5.1 類型分流 recipe card (COLLECTION_TYPE_ROUTING_DESIGN.md) */
.recipe-card { max-width: 640px; margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid #e2e8f0; }
.recipe-card select { font-size: 13px; padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-family: inherit; }
.recipe-knobs { display: flex; flex-direction: column; gap: 4px; margin: 8px 0; }
.recipe-knob { display: grid; grid-template-columns: 168px 1fr; gap: 10px; font-size: 13px; }
.recipe-live { font-size: 11px; color: #15803d; background: #dcfce7; border-radius: 4px; padding: 1px 6px; margin-left: 6px; }
.recipe-planned { font-size: 11px; color: #92400e; background: #fef3c7; border-radius: 4px; padding: 1px 6px; margin-left: 6px; }
.synth-accept { margin: 10px 0; }
/* off-frame (frame scope_exclude) cells — a distinct register from not-comparable */
.synth-offframe > summary { color: #b45309; }
/* 使用說明頁 (/guide) — 書本式 master-detail（沿用 .reading + .coll-detail 殼） */
.guide-chapter { max-width: 780px; line-height: 1.65; }
.guide-chapter.hidden { display: none; }
.guide-chapter h3 { margin: 18px 0 4px; }
.guide-chapter ul, .guide-chapter ol { padding-left: 22px; }
.guide-chapter li { margin: 8px 0; }
.guide-mono { display: inline-block; margin-top: 4px; padding: 2px 8px; background: #f1f5f9; border-radius: 4px; font-variant-numeric: tabular-nums; font-size: 13px; }
.guide-table { border-collapse: collapse; width: 100%; margin-top: 8px; font-size: 14px; }
.guide-table th, .guide-table td { border: 1px solid #e2e8f0; padding: 6px 10px; text-align: left; vertical-align: top; }
.guide-table th { background: #f8fafc; }
.guide-chapter kbd { background: #f1f5f9; border: 1px solid #cbd5e1; border-radius: 4px; padding: 0 5px; font-size: 12px; }
.guide-detail .coll-nav-item .nav-glyph { font-variant-numeric: tabular-nums; }
/* 每章「來源 agent」標籤（hybrid：問題軸主軸 + agent 當來源標籤） */
.guide-src { display: inline-block; margin: 0 0 10px; padding: 3px 10px; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 999px; font-size: 13px; color: #3730a3; }
/* agent 速查的狀態膠囊 */
.ag { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 12px; white-space: nowrap; }
.ag-on { background: #dcfce7; color: #166534; }
.ag-mostly { background: #ecfccb; color: #3f6212; }
.ag-partial { background: #fef9c3; color: #854d0e; }
/* §5.5 lens switcher */
.lens-switch { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 10px; }
.lens-switch .lens-btn { padding: 3px 10px; border: 1px solid #cbd5e1; border-radius: 999px; background: #fff; font-size: 13px; cursor: pointer; }
.lens-switch .lens-btn.active { background: #0ea5e9; border-color: #0ea5e9; color: #fff; }
.lens-switch #lensMore { font-size: 13px; padding: 3px 6px; border: 1px solid #cbd5e1; border-radius: 6px; }
/* §5.3b guideline_delta — what changed vs the last accepted version */
.synth-delta { margin: 10px 0; padding: 10px 12px; border: 1px solid #e2e8f0; border-left: 3px solid #0ea5e9; border-radius: 6px; background: #f8fafc; }
.synth-delta .delta-row { padding: 4px 0; border-bottom: 1px solid #f1f5f9; font-size: 14px; }
.synth-delta .delta-row:last-child { border-bottom: none; }
.coll-detail .synth-delta .delta-row { font-size: calc(14px * var(--prose-scale, 1)); }
@media (max-width: 560px) { .recipe-knob { grid-template-columns: 1fr; gap: 2px; } }

/* ── Scout source row (去哪讀) + provenance chip (怎麼進來) — SCOUT_SOURCE_DESIGN ── */
.src-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.src-avail {
  font-size: 10px;
  padding: 0 6px;
  border-radius: 999px;
  white-space: nowrap;
  border: 1px solid var(--line);
}
.src-avail--free { background: #e7f3ee; color: var(--accent-dark); border-color: #bfe0d4; }
.src-avail--closed { background: #f1efe9; color: var(--muted); border-color: var(--line); }
.src-avail--unknown { background: #f1efe9; color: var(--muted); border-color: var(--line); }
.src-read {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-dark);
  text-decoration: none;
  white-space: nowrap;
}
.src-read:hover { text-decoration: underline; }
.src-more {
  font-size: 12px;
  line-height: 1;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
}
.src-chain {
  display: inline-flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.src-chain.hidden { display: none; }
.src-link {
  font-size: 11px;
  color: var(--muted);
  text-decoration: none;
  white-space: nowrap;
}
.src-link:hover { color: var(--accent-dark); text-decoration: underline; }
.prov-chip {
  font-size: 10px;
  padding: 0 6px;
  margin-right: 6px;
  border-radius: 999px;
  background: #f3efe7;
  color: #6b5a2f;
  border: 1px solid #e2d7bf;
  white-space: nowrap;
  cursor: pointer;
}
.prov-chip:hover { background: #ece3d2; }

/* ── Scout ① journal-lock resolution (新 watchlist 指定期刊) ── */
.jr-resolved {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 2px 0 4px;
}
.jr-row {
  font-size: 12px;
  color: var(--ink);
  line-height: 1.4;
}
.jr-row code {
  background: #eef2f0;
  padding: 0 4px;
  border-radius: 4px;
}
.jr-row.jr-uncertain { color: var(--warning); }
.jr-row.jr-bad { color: var(--danger); }
.jr-warn { color: var(--warning); margin-left: 4px; }

/* ===== Scout Digest (SCOUT_DIGEST_DESIGN.md ①+⑤+④) — 2-pane inbox ===== */
.scout-views { display: flex; gap: 8px; margin-bottom: 16px; }
.scout-views .seg {
  padding: 6px 14px; border: 1px solid var(--line); background: var(--surface);
  border-radius: 999px; cursor: pointer; color: var(--muted); font-size: 0.92rem;
}
.scout-views .seg.active { background: var(--accent); border-color: var(--accent); color: #fff; }
.digest-detail { min-height: 60vh; }
/* left rail = inbox triage list */
#digestRail { padding: 4px 2px; }
.dg-lane { margin-bottom: 14px; }
.dg-lane h3 { margin: 0 0 6px; font-size: 0.92rem; display: flex; align-items: baseline; gap: 6px; }
.dg-lane-n { background: var(--line); color: var(--ink); border-radius: 999px; padding: 0 7px; font-size: 0.72rem; font-weight: 700; }
.dg-lane-sentinel h3 { color: var(--warning); }
.dg-lane-sentinel .dg-lane-n { background: #f3e2cf; }
.dg-note { font-weight: 400; color: var(--muted); font-size: 0.78rem; }
.dg-row { padding: 9px 10px; border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 7px; background: var(--surface); transition: opacity .22s ease, transform .22s ease; }
.dg-lane-sentinel .dg-row { border-color: #ecd8bf; background: #fdf8f1; }
.dg-row.dg-removing { opacity: 0; transform: translateX(14px); }
.dg-paper-head { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
.dg-paper-head a { font-weight: 600; color: var(--ink); text-decoration: none; }
.dg-paper-head a:hover { color: var(--accent); text-decoration: underline; }
.dg-paper-meta { color: var(--muted); font-size: 0.82rem; margin-top: 3px; }
.dg-prov { background: #eef2ee; border-radius: 4px; padding: 1px 6px; margin-left: 2px; }
.dg-reason { color: var(--muted); font-size: 0.84rem; margin-top: 4px; }
.dg-ai { color: var(--accent-dark); font-weight: 600; font-size: 0.76rem; }
.dg-badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 5px; padding: 1px 7px; font-size: 0.78rem; font-weight: 600; }
.dg-badge.dg-bad { background: #f7e4e4; color: var(--danger); }
.dg-badge.dg-guide { background: #e7f1ef; color: var(--accent-dark); }
.dg-badge.dg-tier { background: #e9eef6; color: #38507e; }
.dg-badge.dg-has-file { background: #e3f1e6; color: #2f7d44; font-size: 0.74rem; }
.dg-rule { font-weight: 400; font-size: 0.66rem; color: var(--muted); border-left: 1px solid currentColor; padding-left: 4px; opacity: 0.8; }
.dg-untyped { font-size: 0.74rem; color: var(--muted); border: 1px dashed var(--line); border-radius: 4px; padding: 0 5px; }
/* fixed action column (cross-brainstorm A4: 固定座標 → 肌肉記憶) */
.dg-acts { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; align-items: center; }
.dg-act { border: 1px solid var(--line); background: var(--surface); border-radius: 6px; padding: 3px 9px; font-size: 0.8rem; cursor: pointer; color: var(--ink); }
.dg-act:hover { border-color: var(--muted); }
.dg-act-queue { border-color: var(--accent); color: var(--accent-dark); }
.dg-act-queue:hover { background: var(--accent); color: #fff; }
.dg-act-watch:hover, .dg-act-unwatch:hover { background: #eef2ee; }
.dg-act-skip { color: var(--muted); margin-left: auto; }
.dg-act-skip:hover { background: #f2eeee; color: var(--danger); border-color: var(--danger); }
.dg-colsel { border: 1px solid var(--accent); border-radius: 6px; padding: 3px 6px; font-size: 0.82rem; }
.dg-filter { font-size: 0.84rem; color: var(--muted); margin-bottom: 10px; }
.dg-filter b { color: var(--ink); }
.dg-clearf { border: none; background: none; color: var(--accent); cursor: pointer; font-size: 0.84rem; }
.dg-tail { color: var(--muted); font-size: 0.84rem; margin-top: 6px; }
.dg-backlog { color: var(--muted); }
/* right stage = 本週概覽 dashboard */
.dg-stage-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.dg-stage-head h2 { margin: 0; font-size: 1.1rem; }
.dg-gen { font-size: 0.8rem; }
.dg-sub { font-size: 0.86rem; color: var(--muted); margin: 18px 0 8px; }
.dg-health { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.dg-health span { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 14px; font-size: 0.86rem; color: var(--muted); }
.dg-health b { color: var(--ink); font-size: 1.05rem; margin-left: 4px; }
.dg-volumes { display: flex; flex-wrap: wrap; gap: 7px; }
.dg-vol { background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; font-size: 0.86rem; color: var(--muted); cursor: pointer; }
.dg-vol:hover { border-color: var(--muted); }
.dg-vol.active { background: var(--accent); border-color: var(--accent); color: #fff; }
.dg-vol.active b, .dg-vol.active .dg-dash { color: #fff; }
.dg-vol b { color: var(--ink); }
.dg-surge { color: var(--warning); font-weight: 700; }
.dg-dash { color: var(--muted); }
.dg-coverage { color: var(--warning); font-size: 0.82rem; background: #fdf8f1; border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 12px; margin-top: 14px; }
.dg-hint { margin-top: 16px; font-size: 0.82rem; }
/* Scout app-shell (function rail = left, content = right stage) */
/* Scout uses only 2 panes (nav + stage); override .reading's 3-col grid so the stage gets the full
   remaining width (the empty 3rd review column was squeezing it → cards couldn't wrap). Desktop full-width. */
/* The original .scout container caps at max-width:920px (built for the old centered card wall);
   as an app-shell it should use the full desktop width so the source card grid can wrap. */
.scout-shell { min-height: 64vh; max-width: none; grid-template-columns: 240px minmax(0, 1fr); }
.scout-shell > .reading-main { border-right: none; padding: 6px 22px 24px; }
.wl-card-actions { flex-wrap: wrap; gap: 6px; }
.wl-card-actions button, .wl-card-actions .button { white-space: nowrap; }
#scoutNav .coll-nav-item { font-size: 15px; padding: 9px 11px; margin-bottom: 2px; }
.nav-badge { margin-left: auto; background: var(--accent); color: #fff; border-radius: 999px; padding: 0 7px; font-size: 0.72rem; font-weight: 700; min-width: 18px; text-align: center; line-height: 1.5; }
.nav-badge:empty { display: none; }
.scout-nav-soon { padding: 9px 11px; color: var(--muted); font-size: 13px; opacity: 0.6; margin-top: 8px; border-top: 1px solid var(--line); cursor: default; }
.dg-band { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 14px; margin: 14px 0; }
.dg-band .dg-sub { margin-top: 0; }
.dg-lanes { margin-top: 4px; }
/* 📁 Portfolio cards (attention dashboard over tracked topics) */
.pf-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; cursor: pointer; display: flex; flex-direction: column; gap: 9px; transition: border-color .15s, box-shadow .15s; }
.pf-card:hover { border-color: var(--accent); box-shadow: 0 1px 6px rgba(0,0,0,0.06); }
.pf-card.pf-quiet { opacity: 0.6; }
.pf-card-head { font-weight: 600; font-size: 15px; }
.pf-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pf-chip { font-size: 12px; border-radius: 999px; padding: 2px 9px; background: #eef2ee; color: var(--ink); }
.pf-chip.pf-bad { background: #f7e4e4; color: var(--danger); font-weight: 600; }
.pf-chip.pf-sentinel { background: #fdf1e3; color: var(--warning); font-weight: 600; }
.pf-chip.pf-surge { background: #fdf1e3; color: var(--warning); font-weight: 700; }
.pf-chip.pf-mute { background: transparent; color: var(--muted); border: 1px solid var(--line); }
.pf-foot { color: var(--muted); font-size: 12px; }