/* ============================================================
   SYNOD — intelligence operations meets corporate tribunal.
   Every agent action is a signed record; every decision a filed
   proceeding. Serif for the institution, mono for the record.
   ============================================================ */

:root {
  /* ---- new "ledger / brass" design system (synod.css) ----
     Existing token NAMES are kept so every rule re-themes; their VALUES now
     point at the warm forensic palette. New design names are added below. */
  --bg: #14120e;            /* deep warm near-black */
  --bg-2: #1a1712;          /* alt section */
  --panel: #1c1813;         /* filed box fill */
  --panel-2: #221d16;
  --line: rgba(216,203,176,0.14);
  --line-soft: rgba(216,203,176,0.08);
  --line-strong: rgba(216,203,176,0.30);
  --ink: #ece5d6;
  --fg: #ece5d6;
  --muted: #a59b86;
  --faint: #6e6657;

  /* the single accent — brass/gold */
  --accent: #c9a44c;
  --accent-bright: #d8b35a;
  --gold: #c9a44c;
  --gold-dim: #8a7536;
  --gold-wash: rgba(201,164,76,0.10);

  /* outcomes */
  --good: #5fb46a;  --close: #5fb46a;  --close-dim: rgba(95,180,106,0.16);
  --bad: #c5675a;   --walk: #c5675a;   --walk-dim: rgba(197,103,90,0.16);

  /* five lenses — old (doctrine) names aliased to the new instinct hues */
  --empathy: #9b7fd4;  --trust: #9b7fd4;
  --battle: #d68a4a;   --pressure: #d68a4a;
  --war: #c96aa6;      --frame: #c96aa6;
  --probe: #5b9bd6;
  --risk: #cf6258;     --hedge: #cf6258;

  --serif: "Spectral", Georgia, "Times New Roman", serif;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --maxw: 100ch;
  font-family: var(--sans);
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--ink); line-height: 1.5;
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(201,162,39,0.05), transparent),
    linear-gradient(var(--bg), var(--bg));
}
.hidden { display: none !important; }

/* Microlabel — the system's smallest voice: mono, uppercase, tracked */
.hint { font-family: var(--sans); font-size: 1rem; color: var(--muted); font-weight: 400; text-transform: none; letter-spacing: 0; font-style: normal; }

/* ====== STORYTELLING SCROLL ====== */
.class-strip {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: 0.4rem 1.5rem;
  font-family: var(--mono); font-size: 0.8rem; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--accent); background: rgba(201,162,39,0.06);
  border-bottom: 1px solid rgba(201,162,39,0.18);
  position: sticky; top: 0; z-index: 30;
}
.class-strip .cs-mid { color: var(--muted); letter-spacing: 0.14em; }
.class-strip #provider-badge { color: var(--muted); }

/* Tabs — one focused view at a time; sticky so you can switch anytime */
.tabs {
  display: flex; gap: 0.4rem; justify-content: center;
  padding: 0.55rem 1.5rem; background: var(--bg); border-bottom: 1px solid var(--line);
  position: sticky; top: 49px; z-index: 25;
}
.tab {
  background: transparent; color: var(--muted);
  border: none; border-bottom: 2px solid transparent; border-radius: 0;
  font-family: var(--mono); font-size: 1rem; font-weight: 600; letter-spacing: 0.12em;
  text-transform: uppercase; padding: 0.45rem 1.2rem; cursor: pointer;
}
.tab:hover { background: transparent; color: var(--ink); }
.tab.active { color: var(--accent-bright); border-bottom-color: var(--accent-bright); }
.tab-panel { animation: pop 0.3s ease; }

/* Hero — the landing. Full viewport, centered, one scroll cue. */
.hero {
  overflow: hidden;
  min-height: calc(100vh - 49px);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 2rem 1.5rem 4rem; position: relative;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(ellipse 70% 60% at 50% 35%, rgba(201,162,39,0.07), transparent 70%),
    linear-gradient(var(--bg), var(--bg));
}
.hero-inner { max-width: 760px; }
.hero-kicker {
  font-family: var(--mono); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--accent); display: block; margin-bottom: 1.1rem;
}
.hero h1 {
  margin: 0; font-family: var(--serif); font-weight: 700;
  font-size: 4.2rem; letter-spacing: 0.2em; line-height: 1; color: var(--ink);
}
.hero-promise {
  margin: 0.7rem 0 1.6rem; font-family: var(--serif); font-style: italic; font-weight: 600;
  color: var(--accent-bright); font-size: 1.9rem; line-height: 1.2;
}
.claim {
  margin: 0 auto 1.6rem; max-width: 620px; font-size: 1.05rem; line-height: 1.65; color: var(--ink);
  font-weight: 400;
}
.claim strong { color: var(--accent-bright); font-weight: 600; }

.scroll-cue {
  position: absolute; bottom: 1.4rem; left: 50%; transform: translateX(-50%);
  font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--muted); text-decoration: none; animation: cue-bob 2s ease-in-out infinite;
}
.scroll-cue:hover { color: var(--accent-bright); }
@keyframes cue-bob { 0%,100% { transform: translateX(-50%) translateY(0);} 50% { transform: translateX(-50%) translateY(5px);} }

/* Scenes — the narrative beats between hero and stage. */
.scene { padding: 5rem 1.5rem; border-bottom: 1px solid var(--line-soft); }
.scene-alt { background: var(--panel); }
.scene-inner { max-width: 760px; margin: 0 auto; text-align: center; }
.scene-kicker {
  font-family: var(--mono); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--accent);
}
.scene-h {
  font-family: var(--serif); font-weight: 700; font-size: 2.2rem; line-height: 1.15;
  margin: 1rem 0 1rem; color: var(--ink);
}
.scene-p { font-size: 1.05rem; line-height: 1.7; color: var(--muted); margin: 0 auto; max-width: 620px; }
.scene-p b { color: var(--ink); }
.scene-p .bad-num { color: var(--bad); font-family: var(--mono); }
.scene-p em { color: var(--accent-bright); font-style: italic; }

/* Council vote tableau — the hero visual: one real round deciding */
.tableau { margin-top: 2rem; text-align: left; }
.tb-cp {
  background: var(--panel-2); border: 1px solid var(--line); border-left: 2px solid var(--muted);
  padding: 0.7rem 0.9rem; display: flex; flex-direction: column; gap: 0.2rem;
}
.tb-cp-lbl { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.14em; color: var(--muted); }
.tb-cp-msg { font-family: var(--serif); font-style: italic; font-size: 1.02rem; color: var(--ink); }
.tb-cp-note { font-family: var(--mono); font-size: 0.8rem; color: var(--bad); letter-spacing: 0.03em; }
.tb-arrow { text-align: center; font-family: var(--mono); font-size: 0.74rem; color: var(--muted); letter-spacing: 0.04em; padding: 0.5rem 0; }
.tb-lenses { display: flex; flex-direction: column; gap: 0.3rem; }
.tb-lens {
  display: grid; grid-template-columns: 6rem 1fr auto; align-items: center; gap: 0.7rem;
  padding: 0.45rem 0.7rem; background: var(--bg); border: 1px solid var(--line); border-left: 3px solid var(--muted);
}
.tb-lens[data-d="empathy"] { border-left-color: var(--empathy); }
.tb-lens[data-d="battle"] { border-left-color: var(--battle); }
.tb-lens[data-d="war"] { border-left-color: var(--war); }
.tb-lens[data-d="probe"] { border-left-color: var(--probe); }
.tb-lens[data-d="risk"] { border-left-color: var(--risk); }
.tb-lens.tb-carried { background: rgba(201,162,39,0.07); }
.tb-name { font-weight: 700; font-size: 0.9rem; }
.tb-q { font-family: var(--serif); font-style: italic; font-size: 1rem; color: var(--muted); }
.tb-vote { font-family: var(--mono); font-size: 0.76rem; font-weight: 600; color: var(--muted); white-space: nowrap; }
.tb-carried .tb-vote { color: var(--accent-bright); }
.tb-verdict {
  text-align: center; font-family: var(--mono); font-size: 0.95rem; letter-spacing: 0.08em;
  color: var(--muted); padding: 0.5rem; border: 1px solid rgba(201,162,39,0.45); background: rgba(201,162,39,0.06);
}
.tb-verdict b { color: var(--accent-bright); font-size: 1.1rem; }
.tb-why {
  max-width: 600px; margin: 0.7rem auto 0; text-align: center;
  font-size: 0.82rem; line-height: 1.6; color: var(--muted);
}
.tb-why b { color: var(--ink); }
.tb-why em { color: var(--accent-bright); font-style: italic; }
.tb-outcome { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tb-out-lose, .tb-out-win { padding: 0.7rem 0.9rem; border: 1px solid var(--line); font-size: 0.82rem; color: var(--muted); }
.tb-out-lose { border-left: 3px solid var(--bad); }
.tb-out-win { border-left: 3px solid var(--good); }
.tb-out-lose b { display: block; font-family: var(--mono); font-size: 1.5rem; color: var(--bad); }
.tb-out-win b { display: block; font-family: var(--mono); font-size: 1.5rem; color: var(--good); }
@media (max-width: 620px) { .tb-lens { grid-template-columns: 5rem 1fr; } .tb-q { display: none; } .tb-outcome { grid-template-columns: 1fr; } }

/* Pre-verdict hesitation beat — votes reveal, Arbiter weighs, verdict stamps in */
.tb-weighing { display: none; }
.tableau.tb-anim .tb-lens { opacity: 0; transform: translateY(7px); transition: opacity 0.4s ease, transform 0.4s ease; }
.tableau.tb-anim .tb-lens.show { opacity: 1; transform: none; }
.tableau.tb-anim .tb-decision { opacity: 0; transition: opacity 0.45s ease; }
.tableau.tb-anim .tb-decision.show { opacity: 1; }
.tableau.tb-anim .tb-decision.show .tb-verdict { animation: verdict-in 0.45s cubic-bezier(0.34,1.56,0.64,1) both; }
.tb-weighing.show {
  display: block; text-align: center; padding: 0.7rem;
  font-family: var(--mono); font-size: 0.8rem; letter-spacing: 0.06em; color: var(--accent-bright);
  animation: weigh-pulse 1s ease-in-out infinite;
}
@keyframes weigh-pulse { 0%,100% { opacity: 0.5; } 50% { opacity: 1; } }
.consequence.tb-anim { opacity: 0; transition: opacity 0.5s ease; }
.consequence.tb-anim.show { opacity: 1; }

/* Consequence — the range of outcomes + the needle (real surplus positions) */
.consequence { margin-top: 1.6rem; }
.range {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem;
  margin: 1.4rem 0;
}
.range-cap {
  font-family: var(--mono); font-size: 0.66rem; line-height: 1.4; text-align: center;
  display: flex; flex-direction: column; gap: 0.15rem;
}
.range-cap.worst { color: var(--bad); }
.range-cap.best { color: var(--good); }
.range-tag { font-size: 0.54rem; letter-spacing: 0.16em; opacity: 0.7; }
.range-track {
  position: relative; height: 70px;
  background: linear-gradient(to right, rgba(248,81,73,0.18), rgba(201,162,39,0.12) 45%, rgba(63,185,80,0.18));
  border: 1px solid var(--line);
}
.range-fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  background: linear-gradient(to right, transparent, rgba(63,185,80,0.18));
  border-right: 2px solid var(--good);
  transition: width 1.1s cubic-bezier(0.4,0,0.2,1);
}
.consequence.tb-anim:not(.show) .range-fill { width: 0 !important; }
.range-base {
  position: absolute; left: 2px; top: 50%; transform: translateY(-50%);
  font-family: var(--mono); font-size: 0.74rem; color: var(--bad);
  border: 1px solid rgba(248,81,73,0.4); padding: 0.15rem 0.3rem; background: var(--bg);
}
.range-mark {
  position: absolute; top: 50%; transform: translate(-50%, -50%);
  font-family: var(--mono); font-size: 0.8rem; color: var(--ink); text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 0.1rem;
  background: var(--panel); border: 1px solid var(--accent); padding: 0.2rem 0.4rem;
  white-space: nowrap; transition: opacity 0.4s ease;
}
.range-mark b { color: var(--accent-bright); }
.rm-note { color: var(--muted); font-size: 0.56rem; }
.consequence.tb-anim:not(.show) .range-mark { opacity: 0; }
.cq-foot { font-size: 0.9rem; line-height: 1.65; color: var(--muted); text-align: center; max-width: 640px; margin: 0 auto; }
.cq-foot b { color: var(--ink); }
.col-amber { color: var(--accent-bright) !important; }
.col-green { color: var(--good) !important; }
@media (max-width: 620px) { .range { grid-template-columns: 1fr; } .range-mark { font-size: 0.56rem; } }
.cq-title { text-align: center; font-size: 0.85rem; color: var(--muted); line-height: 1.5; margin-bottom: 1rem; }
.cq-title b { color: var(--accent-bright); }
.cq-track { display: flex; align-items: stretch; justify-content: center; gap: 0.5rem; flex-wrap: wrap; }
.cq-step {
  display: flex; flex-direction: column; gap: 0.1rem; align-items: center;
  border: 1px solid var(--line); background: var(--bg); padding: 0.74rem 1rem; min-width: 7rem;
}
.cq-step.up { border-color: rgba(63,185,80,0.4); }
.cq-r { font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.12em; color: var(--muted); }
.cq-offer { font-family: var(--mono); font-size: 1.3rem; font-weight: 700; color: var(--ink); }
.cq-step.up .cq-offer { color: var(--good); }
.cq-note { font-size: 0.66rem; color: var(--muted); }
.cq-arrow { align-self: center; color: var(--good); font-weight: 700; }
.cq-outcome { display: flex; justify-content: center; gap: 1.4rem; flex-wrap: wrap; margin-top: 1.1rem; font-size: 0.9rem; color: var(--muted); }
.cq-win b { font-family: var(--mono); color: var(--good); font-size: 1.1rem; }
.cq-lose b { font-family: var(--mono); color: var(--bad); font-size: 1.1rem; }

/* Stage — the interactive section */
.stage { padding-top: 3.5rem; border-bottom: 1px solid var(--line-soft); }
.stage-head { text-align: center; margin-bottom: 1.6rem; }
.stage-head .scene-h { font-size: 1.8rem; margin-bottom: 0.74rem; }

.stat-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line); text-align: left; }
.stat { padding: 0.65rem 0.85rem; border-right: 1px solid var(--line); background: var(--panel); }
.stat:last-child { border-right: none; }
.stat b {
  display: block; font-family: var(--mono); font-size: 1.15rem; font-weight: 600;
  color: var(--accent-bright); letter-spacing: 0.02em; margin-bottom: 0.2rem;
}
.stat span { font-size: 0.7rem; color: var(--muted); line-height: 1.45; display: block; }
.stat-caption { margin: 0.5rem 0 0; font-size: 0.68rem; color: var(--muted); letter-spacing: 0.02em; }

.convene-bar {
  display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap;
  padding: 0.7rem 1.5rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  background: var(--panel);
  max-width: 1280px; margin: 0 auto;
}
.cb-label {
  font-family: var(--mono); font-size: 0.8rem; text-transform: uppercase;
  letter-spacing: 0.14em; color: var(--muted); white-space: nowrap;
}
select {
  background: var(--panel-2); color: var(--ink); border: 1px solid var(--line);
  border-radius: 3px; padding: 0.5rem 0.7rem; font-size: 0.85rem; font-family: var(--sans);
  max-width: 480px;
}
button {
  background: var(--accent); color: #16110a; border: none; border-radius: 3px;
  padding: 0.55rem 1.1rem; font-size: 0.85rem; font-weight: 700; cursor: pointer;
  font-family: var(--sans); letter-spacing: 0.02em;
  transition: background 0.2s;
}
button:hover { background: var(--accent-bright); }
button:disabled { opacity: 0.45; cursor: default; }

/* ====== LAYOUT ====== */
/* Proceedings get the full stage; trajectory is its own band below — the
   deliberation is the show, the charts are the post-game analysis. */
main {
  display: flex; flex-direction: column; gap: 1.75rem;
  padding: 1.5rem;
  max-width: 1280px; margin: 0 auto;
}
main > .column { min-width: 0; }
.sec-head {
  display: flex; align-items: baseline; gap: 0.74rem;
  font-family: var(--mono); font-size: 0.8rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.16em; color: var(--ink);
  margin: 0 0 0.9rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--line);
}
.sec-no { color: var(--accent); font-weight: 600; }
.sec-head .hint { letter-spacing: 0; text-transform: none; font-weight: 400; margin-left: auto; text-align: right; }

/* ====== SCENARIO / OPERATION BRIEF ====== */
.scenario-card { margin-bottom: 1rem; }
.sc-when {
  background: var(--panel); border: 1px solid var(--line); border-left: 2px solid var(--accent);
  padding: 0.7rem 0.95rem; font-size: 0.83rem; line-height: 1.6; color: var(--muted);
}
.sc-lbl {
  display: block; font-family: var(--mono); font-size: 0.74rem; text-transform: uppercase;
  letter-spacing: 0.16em; color: var(--accent); margin-bottom: 0.3rem;
}

/* ====== ROUNDS — session records ====== */
.rounds { display: flex; flex-direction: column; gap: 1.1rem; }
.round {
  border: 1px solid var(--line); background: var(--panel);
  padding: 0.85rem 1rem 0.95rem; animation: pop 0.3s ease;
  position: relative;
}
.round::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(to right, var(--accent), transparent 40%);
  opacity: 0.6;
}
@keyframes pop { from { opacity: 0; transform: translateY(8px);} to { opacity: 1; transform: none; } }
@keyframes verdict-in { from { opacity: 0; transform: scale(0.96) translateY(5px); } to { opacity: 1; transform: none; } }
@keyframes lens-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.round-head {
  display: flex; align-items: baseline; gap: 0.7rem;
  font-family: var(--mono); font-size: 1rem; font-weight: 600;
  letter-spacing: 0.14em; color: var(--accent); margin-bottom: 0.65rem;
}
.rh-rule { flex: 1; height: 1px; background: var(--line); align-self: center; }
.rh-time { font-weight: 400; font-size: 0.8rem; color: var(--muted); letter-spacing: 0.1em; text-transform: uppercase; }

/* Negotiation turns — the round reads as a dialogue: their line (left) ↔ our line (right) */
.turn { max-width: 82%; padding: 0.55rem 1rem 0.74rem; margin-bottom: 0.7rem; border: 1px solid var(--line-soft); }
.turn-cp { background: var(--panel-2); border-left: 2px solid var(--muted); margin-right: auto; }
.turn-council { background: rgba(63,185,80,0.05); border-right: 2px solid var(--good); margin-left: auto; }
.turn-head { display: flex; align-items: baseline; justify-content: space-between; gap: 0.74rem; margin-bottom: 0.3rem; }
.turn-council .turn-head { flex-direction: row-reverse; }
.turn-who {
  font-family: var(--mono); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.14em;
}
.turn-cp .turn-who { color: var(--muted); }
.turn-council .turn-who { color: var(--good); }
.turn-meta { font-family: var(--mono); font-size: 0.8rem; color: var(--muted); }
.turn-council .turn-meta { color: var(--accent-bright); }
.turn-act { color: var(--muted); border: 1px solid var(--line); padding: 0.02rem 0.3rem; font-size: 0.74rem; }
.turn-msg { font-size: 0.92rem; line-height: 1.55; min-height: 1.4em; color: var(--ink); }
.turn-council .turn-msg { font-style: italic; }
.turn .sig { margin-top: 0.4rem; }
.tagx {
  display: inline-block; font-family: var(--mono); font-size: 0.8rem;
  background: var(--panel); border: 1px solid var(--line); padding: 0.05rem 0.4rem;
  margin-right: 0.25rem; color: var(--muted); letter-spacing: 0.04em;
}

/* Belief row */
.belief-row { display: flex; gap: 0.5rem; align-items: center; margin: 0.5rem 0; font-size: 0.8rem; }
.belief-lbl { font-family: var(--mono); font-size: 0.74rem; color: var(--muted); white-space: nowrap; text-transform: uppercase; letter-spacing: 0.12em; }
.belief-dom { font-size: 0.68rem; white-space: nowrap; font-weight: 600; }
.bbar { flex: 1; display: flex; height: 9px; overflow: hidden; border: 1px solid var(--line); }
.bbar span { display: block; height: 100%; }
.bseg-relationship { background: var(--war); }
.bseg-soft_floor { background: var(--accent); }
.bseg-deceptive { background: var(--risk); }
.bseg-relationship-txt { color: var(--war); }
.bseg-soft_floor-txt { color: var(--accent); }
.bseg-deceptive-txt { color: var(--risk); }
.arrow { color: var(--muted); }

.belief-delta {
  font-family: var(--mono); font-size: 0.8rem; font-weight: 600;
  padding: 0.06rem 0.3rem; margin-left: 0.25rem;
}
.belief-delta.up { color: var(--good); background: rgba(63,185,80,0.12); }
.belief-delta.dn { color: var(--bad); background: rgba(248,81,73,0.12); }

/* Empathy broadcast */
.empathy-broadcast {
  border: 1px solid rgba(163,113,247,0.2); border-left: 2px solid var(--empathy);
  background: rgba(163,113,247,0.04);
  padding: 0.5rem 0.75rem; margin: 0.4rem 0;
  animation: pop 0.25s ease;
}
.eb-header { display: flex; align-items: baseline; gap: 0.5rem; margin-bottom: 0.3rem; flex-wrap: wrap; }
.eb-label {
  font-family: var(--mono); font-size: 0.74rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--empathy);
}
.eb-type { font-weight: 700; font-size: 0.88rem; }
.eb-trust { margin-left: auto; }
.eb-arrow { color: var(--empathy); opacity: 0.55; }
.eb-summary { font-size: 0.82rem; color: var(--muted); line-height: 1.5; }
.eb-flags { margin-top: 0.3rem; }

/* ====== LENS CARDS ====== */
.lenses { display: flex; flex-direction: column; gap: 0.45rem; margin: 0.7rem 0; }
.lens {
  border: 1px solid var(--line); border-left: 3px solid var(--muted);
  background: var(--panel-2); cursor: pointer; overflow: hidden;
  animation: lens-in 0.25s ease both; animation-delay: var(--lens-delay, 0ms);
  transition: background 0.3s ease, border-color 0.3s ease;
}
.lens:hover { border-color: var(--accent); }
.lens[data-d="empathy"] { border-left-color: var(--empathy); }
.lens[data-d="battle"] { border-left-color: var(--battle); }
.lens[data-d="war"] { border-left-color: var(--war); }
.lens[data-d="probe"] { border-left-color: var(--probe); }
.lens[data-d="risk"] { border-left-color: var(--risk); }

.lens.lens-agree { background: rgba(63,185,80,0.05); }
.lens.lens-agree .lens-fav { color: var(--good); background: rgba(63,185,80,0.12); border-color: rgba(63,185,80,0.3); }
.lens.lens-agree .lens-fav::after { content: " ✓"; }
.lens.lens-dissent { opacity: 0.72; }
.lens.lens-dissent .lens-fav { color: var(--muted); background: transparent; border-color: var(--line); }

.lens-head { display: flex; align-items: baseline; gap: 0.5rem; padding: 0.38rem 0.7rem; font-size: 0.85rem; }
.lens-name { font-weight: 700; }
.lens-q-full {
  font-family: var(--serif); font-style: italic; font-size: 1rem;
  color: var(--muted); margin-top: 0.5rem;
}
.lens-role {
  font-family: var(--serif); font-style: italic; font-size: 0.8rem; color: var(--muted);
}
.lens-persona {
  font-family: var(--mono); font-size: 0.74rem; color: var(--muted);
  background: var(--panel); border: 1px solid var(--line); padding: 0.05rem 0.35rem; font-weight: 400;
}
.lens-dim { font-family: var(--mono); font-size: 0.56rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.6; white-space: nowrap; }
.lens-q { color: var(--muted); font-size: 0.76rem; font-style: italic; font-family: var(--serif); }
.lens-fav {
  margin-left: auto; white-space: nowrap;
  font-family: var(--mono); font-size: 0.68rem; font-weight: 600; color: var(--accent-bright);
  background: rgba(201,162,39,0.1); border: 1px solid rgba(201,162,39,0.25);
  padding: 0.1rem 0.45rem;
  transition: color 0.3s, background 0.3s, border-color 0.3s;
}
.caret { color: var(--muted); font-size: 0.75rem; transition: transform 0.2s; }
.lens.open .caret { transform: rotate(90deg); }
.lens-body { display: none; padding: 0 0.7rem 0.7rem; border-top: 1px solid var(--line); }
.lens.open .lens-body { display: block; }
.lens-meta { font-size: 0.8rem; color: var(--muted); margin: 0.55rem 0; }
.lens-meta b { color: var(--ink); font-weight: 600; }
.lens-rationale { font-size: 0.82rem; margin: 0.5rem 0 0.74rem; font-family: var(--serif); font-style: italic; }
.score-scale { display: grid; grid-template-columns: 6.5rem 1fr 2.6rem; gap: 0.4rem; margin-bottom: 0.1rem; }
.scale-track { display: flex; justify-content: space-between; font-size: 0.74rem; color: var(--muted); padding: 0 0.1rem; opacity: 0.6; }
.score-row { display: grid; grid-template-columns: 6.5rem 1fr 2.6rem; align-items: center; gap: 0.4rem; margin: 0.18rem 0; font-size: 0.8rem; }
.score-track { position: relative; height: 7px; background: linear-gradient(to right, rgba(248,81,73,0.10) 50%, rgba(63,185,80,0.10) 50%); }
.score-track .mid { position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: var(--muted); opacity: 0.4; }
.fill { position: absolute; top: 0; bottom: 0; }
.fill.pos { left: 50%; background: var(--good); }
.fill.neg { right: 50%; background: var(--bad); }

/* Vote split */
.vote-split {
  display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap;
  margin: 0.1rem 0 0.4rem; padding: 0.4rem 0.75rem;
  background: rgba(255,255,255,0.03); border: 1px solid var(--line);
  font-size: 1rem;
  animation: pop 0.3s ease both;
}
.split-lbl {
  font-family: var(--mono); font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.14em;
  color: var(--muted); white-space: nowrap; flex-shrink: 0;
}
.split-dot { color: var(--line); }
.vote-split b { color: var(--accent-bright); }
.split-unanimous { color: var(--good); font-weight: 600; }

/* ====== CHALLENGE RECORD — two sealed briefs, opened in sequence ====== */
.challenge-record { margin: 0.25rem 0 0.45rem; }
.cr-briefs { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.cr-brief {
  position: relative; overflow: hidden; min-height: 56px;
  border: 1px solid var(--line);
  background: var(--panel);
  transition: background 0.4s ease;
}
.cr-brief::before {
  content: ''; position: absolute; left: 0; right: 0; top: 27px; height: 1px;
  background: var(--line);
  transition: opacity 0.25s ease 0.2s; pointer-events: none;
}
.cr-brief.open::before { opacity: 0; }
.cr-brief.open { background: rgba(255,255,255,0.025); }
.cr-brief-inner {
  padding: 0 0.75rem; max-height: 0; overflow: hidden;
  transition: max-height 0.4s ease-out, padding 0.35s ease-out;
}
.cr-brief.open .cr-brief-inner { max-height: 400px; padding-top: 0.65rem; padding-bottom: 0.65rem; }
.cr-brief-label {
  font-family: var(--mono); font-size: 0.8rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 0.35rem;
}
.cr-speech {
  font-family: var(--serif); font-size: 0.88rem; font-style: italic; line-height: 1.55;
  color: var(--ink); margin-bottom: 0.4rem;
}
.cr-stance { font-size: 0.63rem; color: var(--muted); }
.cr-stance-lbl { font-family: var(--mono); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; }
.cr-revision {
  margin-top: 0.35rem; padding: 0.3rem 0.5rem;
  font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.04em;
  color: var(--ink); background: rgba(201,162,39,0.14);
  border-left: 2px solid var(--accent-bright);
}
.cr-revision b { color: var(--accent-bright); font-size: 1rem; }

/* The challenge as an explicit reaction thread + turning point */
.cr-thread { font-size: 0.86rem; color: var(--muted); margin-bottom: 0.5rem; }
.cr-thread-x, .cr-thread-d { font-weight: 700; }
.cr-turn {
  margin-top: 0.5rem; padding: 0.4rem 0.74rem; font-size: 1rem; line-height: 1.5;
  border-left: 2px solid var(--line);
}
.cr-turn b { color: var(--ink); }
.cr-moved { background: rgba(201,162,39,0.1); border-left-color: var(--accent-bright); }
.cr-moved b { color: var(--accent-bright); }
.cr-held { background: rgba(255,255,255,0.02); border-left-color: var(--good); }
.cr-held b { color: var(--good); }
.cr-verdict {
  margin-top: 0.35rem; text-align: center; padding: 0.3rem 0;
  font-family: var(--mono); font-size: 0.63rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.16em; color: var(--muted);
  opacity: 0; transition: opacity 0.5s ease 0.2s;
}
.cr-verdict.resolved { opacity: 1; }
.verdict-holds { color: var(--good); }
.verdict-carries { color: var(--accent-bright); }
.verdict-other { color: var(--muted); }

/* ====== DECISION BLOCK ====== */
.decision {
  font-size: 0.9rem; background: rgba(201,162,39,0.05);
  border: 1px solid var(--line); border-left: 2px solid var(--accent);
  padding: 0.74rem 0.75rem; margin-top: 0.5rem;
  animation: verdict-in 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.decision .rec { font-size: 1.15rem; font-weight: 700; color: var(--good); }
.decision .row { margin-top: 0.25rem; color: var(--muted); }
.pill { font-family: var(--mono); font-weight: 600; padding: 0.05rem 0.4rem; font-size: 0.66rem; letter-spacing: 0.06em; }
.pill.execute { background: rgba(63,185,80,0.18); color: var(--good); }
.pill.block { background: rgba(248,81,73,0.18); color: var(--bad); }
.pill.escalate { background: rgba(201,162,39,0.18); color: var(--accent-bright); }

.ctx-vec { font-size: 1rem; border-top: 1px solid var(--line); margin-top: 0.3rem; padding-top: 0.3rem; }
.ctx-lbl { font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.58rem; color: var(--muted); margin-right: 0.3rem; }

.dispersion-row { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.3rem; font-size: 1rem; }
.dispersion-track { flex: 0 0 72px; height: 4px; background: var(--line); overflow: hidden; }
.dispersion-fill {
  height: 100%; background: linear-gradient(to right, var(--accent), var(--bad));
  transition: width 0.4s cubic-bezier(0.4,0,0.2,1);
}

/* Arbiter terrain subsection */
.arbiter-section { margin-top: 0.45rem; padding-top: 0.45rem; border-top: 1px solid var(--line); }
.arb-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.4rem; }
.arb-badge {
  font-family: var(--mono); font-size: 0.74rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.14em; color: var(--muted);
}
.arb-rounds { margin-left: auto; }
.arb-terrain { display: flex; flex-direction: column; gap: 0.2rem; margin-bottom: 0.35rem; }
.arb-factor { display: grid; grid-template-columns: 6.2rem 1fr 2.4rem 5.5rem; align-items: center; gap: 0.5rem; }
.arb-flabel {
  font-family: var(--mono); font-size: 0.56rem; color: var(--muted);
  text-transform: uppercase; letter-spacing: 0.08em; cursor: help;
}
.arb-bar { height: 3px; background: var(--panel-2); border: 1px solid var(--line); overflow: hidden; }
.arb-fill { height: 100%; background: var(--muted); opacity: 0.55; }
.arb-fval { font-family: var(--mono); font-size: 0.74rem; color: var(--muted); text-align: right; }
.arb-lifts { font-family: var(--mono); font-size: 0.74rem; font-weight: 600; white-space: nowrap; }
.arb-lifts-none::after { content: "—"; color: var(--line); }
@media (max-width: 620px) { .arb-factor { grid-template-columns: 5rem 1fr auto; } .arb-lifts { display: none; } }
.arb-narrative { font-size: 0.8rem; color: var(--muted); font-style: italic; line-height: 1.5; font-family: var(--serif); }

/* Council outbound move */
.council-move { margin-top: 0.55rem; font-size: 0.85rem; padding-top: 0.45rem; border-top: 1px dashed var(--line); }
.council-move .lbl {
  font-family: var(--mono); font-size: 0.8rem; color: var(--accent);
  text-transform: uppercase; letter-spacing: 0.14em;
}

/* ====== TRAJECTORY PANELS — a horizontal analysis band ====== */
.trajectory {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem; align-items: start;
}
.trajectory .sec-head { grid-column: 1 / -1; margin-bottom: 0; }
.panel { background: var(--panel); border: 1px solid var(--line); padding: 0.9rem 1rem; margin-bottom: 0; }
.panel h3 { margin: 0 0 0.7rem; font-size: 0.85rem; font-weight: 600; }
.traj { display: flex; flex-direction: column; gap: 0.4rem; }
.traj-row { display: grid; grid-template-columns: 2.4rem 1fr 5.5rem; align-items: center; gap: 0.5rem; font-size: 1rem; color: var(--muted); font-family: var(--mono); border-radius: 2px; }
.traj-dom { font-size: 0.8rem; font-weight: 600; text-align: right; }
.stack { display: flex; height: 16px; overflow: hidden; border: 1px solid var(--line); }
.stack span { height: 100%; }
.seg-empathy { background: var(--empathy); }
.seg-battle { background: var(--battle); }
.seg-war { background: var(--war); }
.seg-probe { background: var(--probe); }
.seg-risk { background: var(--risk); }
.legend { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.74rem; font-size: 1rem; color: var(--muted); }
.legend i { display: inline-block; width: 10px; height: 10px; margin-right: 0.25rem; vertical-align: middle; }

.bbar span, .stack span { animation: bar-reveal 0.55s cubic-bezier(0.4,0,0.2,1) both; }
@keyframes bar-reveal {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0 0 0); }
}

/* ====== TERMINAL — case disposition ====== */
.case-stamp {
  display: inline-block; margin-bottom: 0.74rem;
  font-family: var(--mono); font-size: 0.8rem; font-weight: 600;
  letter-spacing: 0.22em; text-transform: uppercase;
  padding: 0.3rem 0.7rem; border: 2px solid currentColor;
  transform: rotate(-3deg); transform-origin: left center;
  animation: stamp-in 0.35s cubic-bezier(0.34, 1.8, 0.64, 1) both;
}
.case-stamp.closed { color: var(--good); }
.case-stamp.walked { color: var(--bad); }
@keyframes stamp-in {
  from { opacity: 0; transform: rotate(-3deg) scale(1.6); }
  to   { opacity: 1; transform: rotate(-3deg) scale(1); }
}
.terminal .big { font-family: var(--mono); font-size: 1.7rem; font-weight: 700; color: var(--good); }
.terminal .walk { color: var(--bad); }
.terminal .sub { color: var(--muted); font-size: 0.82rem; }
.trust-row { display: flex; align-items: baseline; gap: 0.5rem; margin-top: 0.75rem; }
.trust-score { font-family: var(--mono); font-size: 1.3rem; font-weight: 700; }
.trust-label { font-size: 0.82rem; color: var(--muted); }

/* ====== EXHIBIT A (A/B) ====== */
.ab-section { padding: 0 1.5rem 2rem; max-width: 1280px; margin: 0 auto; }
.ab-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; border: 1px solid var(--line); }
.ab-table th, .ab-table td { padding: 0.55rem 0.7rem; border-bottom: 1px solid var(--line); text-align: right; }
.ab-table th { font-family: var(--mono); font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); font-weight: 600; background: var(--panel); }
.ab-table th:first-child, .ab-table td:first-child { text-align: left; }
.ab-table th.synod-col, .ab-table td.synod-col { background: rgba(63,185,80,0.07); }
.ab-table th.synod-col { color: var(--good); }
.win { color: var(--good); font-weight: 700; }
.lose { color: var(--bad); }
.walktag { color: var(--bad); font-weight: 700; }
.ab-note { color: var(--ink); font-size: 0.9rem; margin-top: 1rem; max-width: 60rem; line-height: 1.7; }
.oc-lbl { font-family: var(--mono); font-size: 0.74rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; }

/* ====== CHARTS (readable instead of tables) ====== */
.chart-box { min-height: 2rem; color: var(--muted); font-size: 0.85rem; }
.chart-total {
  margin-top: 0.9rem; font-size: 0.82rem; color: var(--muted);
  border-top: 1px solid var(--line); padding-top: 0.7rem;
}
.chart-total b { color: var(--ink); font-family: var(--mono); }
.chart-total b.win { color: var(--good); }

/* Exhibit A — paired bars */
.pbars { display: flex; flex-direction: column; gap: 0.9rem; }
.pbar-group { border-left: 2px solid var(--line); padding-left: 1rem; }
.pbar-group.pbar-hot { border-left-color: var(--bad); }
.pbar-label { font-size: 0.82rem; color: var(--ink); margin-bottom: 0.35rem; font-weight: 600; }
.pbar-row { display: grid; grid-template-columns: 4.5rem 1fr auto; align-items: center; gap: 0.74rem; margin: 0.2rem 0; }
.pbar-who { font-family: var(--mono); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
.pbar-who.syn { color: var(--good); }
.pbar-track { height: 16px; background: var(--panel-2); border: 1px solid var(--line); overflow: hidden; }
.pbar-fill { display: block; height: 100%; transition: width 0.6s cubic-bezier(0.4,0,0.2,1); }
.pbar-fill.base { background: var(--muted); opacity: 0.55; }
.pbar-fill.syn { background: var(--good); }
.pbar-val { font-family: var(--mono); font-size: 0.8rem; color: var(--ink); white-space: nowrap; }
.pbar-val .hint { font-family: var(--sans); }

/* Exhibit B — drop bars */
.dropbars { display: flex; flex-direction: column; gap: 0.4rem; }
.drop-row { display: grid; grid-template-columns: 16rem 1fr auto; align-items: center; gap: 0.7rem; font-size: 1rem; }
.drop-row.drop-causal { background: rgba(201,162,39,0.06); }
.drop-label { color: var(--ink); }
.drop-label .hint { font-size: 0.66rem; }
.drop-track { height: 14px; background: var(--panel-2); border: 1px solid var(--line); overflow: hidden; }
.drop-fill { display: block; height: 100%; transition: width 0.6s cubic-bezier(0.4,0,0.2,1); }
.drop-fill.full { background: var(--good); }
.drop-fill.causal { background: var(--accent-bright); }
.drop-fill.drop { background: var(--muted); opacity: 0.7; }
.drop-fill.crater { background: var(--bad); opacity: 0.8; }
.drop-val { font-family: var(--mono); font-size: 0.76rem; color: var(--ink); white-space: nowrap; }
.drop-delta { color: var(--muted); margin-left: 0.3rem; }
.drop-delta.lose { color: var(--bad); }

/* Exhibit C — heatmap (scrolls inside its box on narrow screens instead of stretching the page) */
@media (max-width: 620px){ .chart-box { overflow-x: auto; } .heatmap { min-width: 480px; } }
.heatmap { display: grid; gap: 3px; font-family: var(--mono); }
.hm-h, .hm-total {
  font-size: 0.58rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--muted); text-align: center; padding: 0.3rem 0.2rem; align-self: end;
}
.hm-h.hm-council, .hm-total.hm-council { color: var(--accent-bright); }
.hm-rowlabel {
  font-family: var(--sans); font-size: 1rem; color: var(--ink);
  display: flex; align-items: center; padding-right: 0.4rem; cursor: help;
}
.hm-cell {
  text-align: center; padding: 0.55rem 0.2rem; font-size: 1rem; color: var(--ink);
  border: 1px solid rgba(0,0,0,0.25);
}
.hm-cell.hm-council { outline: 2px solid var(--accent-bright); outline-offset: -2px; }
.hm-total { font-family: var(--mono); color: var(--ink); border-top: 1px solid var(--line); }
.hm-total.hm-best { color: var(--good); font-weight: 700; }
.hm-totlabel { font-family: var(--sans); font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); }

/* ====== COLOPHON ====== */
.colophon {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.5rem 1.2rem; max-width: 1280px; margin: 0 auto;
  border-top: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 0.8rem; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--muted); opacity: 0.7;
}

/* ====== INDICATORS ====== */
.thinking, .between-rounds { display: flex; gap: 5px; align-items: center; padding: 0.5rem 0.1rem; }
.between-rounds { padding: 0.74rem 1.5rem; }
.thinking span, .between-rounds span {
  width: 6px; height: 6px; border-radius: 50%; background: var(--line);
  animation: pulse-dot 1.2s ease-in-out infinite;
}
.thinking span:nth-child(2), .between-rounds span:nth-child(2) { animation-delay: 0.2s; }
.thinking span:nth-child(3), .between-rounds span:nth-child(3) { animation-delay: 0.4s; }
@keyframes pulse-dot {
  0%, 80%, 100% { opacity: 0.25; transform: scale(0.85); }
  40% { opacity: 1; transform: scale(1.15); }
}

.stream-error {
  margin-top: 0.5rem; padding: 0.5rem 0.75rem;
  background: rgba(248,81,73,0.08); border: 1px solid rgba(248,81,73,0.25);
  font-size: 0.82rem; color: var(--bad);
  animation: pop 0.25s ease;
}

/* ====== TOOLTIPS ====== */
.iicon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--panel-2); border: 1px solid var(--line);
  color: var(--muted); font-size: 0.74rem; font-style: normal; font-weight: 700;
  cursor: help; position: relative; margin-left: 0.3rem;
  vertical-align: middle; flex-shrink: 0; line-height: 1;
  font-family: var(--sans);
}
.iicon::after {
  content: attr(data-tip); display: none;
  position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%);
  background: var(--panel-2); border: 1px solid var(--line);
  color: var(--ink); font-size: 0.8rem; line-height: 1.5;
  padding: 0.45rem 0.65rem; width: 230px; white-space: normal; text-align: left;
  z-index: 200; pointer-events: none;
  box-shadow: 0 4px 18px rgba(0,0,0,0.5);
  letter-spacing: 0; text-transform: none; font-family: var(--sans); font-weight: 400;
}
.iicon:hover::after { display: block; }

/* ====== INTERACTIVE LAYER (S6) ====== */

/* Speed toggle */
.ghost-btn {
  background: transparent; color: var(--muted); border: 1px solid var(--line);
  font-family: var(--mono); font-weight: 600; padding: 0.5rem 0.7rem;
}
.ghost-btn:hover { background: var(--panel-2); color: var(--ink); }

/* Masthead collapses once the proceedings start — the claim has been read */
.mast-main { transition: max-height 0.45s ease, opacity 0.3s ease, padding 0.45s ease; max-height: 400px; overflow: hidden; }
body.running .mast-main { max-height: 0; opacity: 0; padding-top: 0; padding-bottom: 0; }

/* Stat chips are anchors to the evidence */
a.stat { text-decoration: none; color: inherit; transition: border-color 0.2s, background 0.2s; }
a.stat:hover { background: var(--panel-2); }

/* Operation brief, compact during the run */
.scenario-card.compact .sc-when {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  padding-top: 0.4rem; padding-bottom: 0.4rem;
}
.scenario-card.compact .sc-lbl { display: inline; margin-right: 0.4rem; }

/* Pipeline spine — the data flow, lit stage by stage */
.pipeline-rail {
  display: flex; align-items: center; gap: 0.15rem;
  padding: 0.45rem 1.5rem; border-top: 1px solid var(--line-soft);
  background: var(--panel); overflow-x: auto;
  max-width: 1280px; margin: 0 auto;
}
.rail-round {
  font-family: var(--mono); font-size: 0.66rem; font-weight: 700; color: var(--accent);
  margin-right: 0.74rem; min-width: 2rem;
}
.rail-node {
  display: inline-flex; align-items: center; gap: 0.3rem;
  font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.1em;
  color: var(--line); cursor: pointer; white-space: nowrap;
  transition: color 0.25s;
}
.rail-node i {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--line); transition: background 0.25s, box-shadow 0.25s;
}
.rail-node.done { color: var(--muted); }
.rail-node.done i { background: var(--muted); }
.rail-node.live { color: var(--accent-bright); }
.rail-node.live i {
  background: var(--accent-bright);
  box-shadow: 0 0 8px rgba(227,191,69,0.7);
  animation: rail-pulse 1s ease-in-out infinite;
}
@keyframes rail-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.45); } }
.rail-edge { flex: 1; height: 1px; background: var(--line); min-width: 8px; }

/* Deception-disarmed climax banner */
.disarm-banner {
  display: flex; align-items: center; gap: 0.7rem;
  margin-bottom: 0.74rem; padding: 0.5rem 0.75rem;
  background: rgba(201,162,39,0.1); border: 1px solid rgba(201,162,39,0.4);
  animation: verdict-in 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.db-stamp {
  font-family: var(--mono); font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.18em; color: var(--accent-bright); white-space: nowrap;
}
.db-text { font-size: 1rem; color: var(--ink); }

/* Offer delta */
.offer-delta { font-family: var(--mono); font-size: 0.68rem; font-weight: 600; margin-left: 0.3rem; }
.offer-delta.up { color: var(--good); }
.offer-delta.dn { color: var(--bad); }

/* Decision hierarchy: the recommendation is the round's output */
.rec-line { margin-bottom: 0.2rem; }
.rec-lbl {
  font-family: var(--mono); font-size: 0.58rem; font-weight: 700;
  letter-spacing: 0.14em; color: var(--muted); margin-right: 0.35rem;
}

/* Hold the gavel */
.gavel { margin-top: 0.55rem; border-top: 1px dashed var(--line); padding-top: 0.4rem; }
.gavel summary {
  cursor: pointer; font-size: 0.8rem; color: var(--accent-bright);
  list-style: none; user-select: none;
}
.gavel summary::-webkit-details-marker { display: none; }
.gavel-mark { margin-right: 0.25rem; }
.gavel-body { padding: 0.5rem 0 0.2rem; }
.gavel-row {
  display: grid; grid-template-columns: 5rem 1fr 2.8rem;
  align-items: center; gap: 0.55rem; margin: 0.22rem 0;
}
.gavel-lens { font-family: var(--mono); font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; }
.gavel-row input[type="range"] {
  -webkit-appearance: none; appearance: none; height: 3px;
  background: var(--line); outline: none; width: 100%;
}
.gavel-row input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--accent-bright); cursor: grab; border: 2px solid var(--bg);
}
.gavel-val { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); text-align: right; }
.gavel-verdict {
  margin-top: 0.45rem; padding: 0.35rem 0.55rem; font-size: 1rem;
  background: rgba(255,255,255,0.025); border-left: 2px solid var(--line);
  transition: border-color 0.25s;
}
.gavel-verdict .gv-same { color: var(--good); }
.gavel-verdict .gv-diff { color: var(--accent-bright); }
.gavel-verdict.diverged { border-left-color: var(--accent-bright); }

/* Receipt chip */
.receipt-chip {
  display: inline-flex; align-items: center; gap: 0.35rem;
  margin-top: 0.45rem; padding: 0.18rem 0.5rem; cursor: pointer;
  font-family: var(--mono); font-size: 0.8rem; letter-spacing: 0.06em;
  color: var(--muted); border: 1px solid var(--line); background: var(--panel);
}
.receipt-chip:hover { color: var(--ink); border-color: var(--muted); }
.rc-tick { color: var(--good); }
.rc-sig { opacity: 0.65; }
.receipt-json {
  margin: 0.4rem 0 0; padding: 0.55rem 0.7rem; overflow-x: auto;
  font-family: var(--mono); font-size: 0.74rem; line-height: 1.5;
  color: var(--muted); background: var(--bg); border: 1px solid var(--line);
}

/* Disposition band — the proceeding's own ending */
.disposition {
  display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap;
  padding: 1rem 1.2rem; border: 1px solid var(--line);
  animation: verdict-in 0.4s ease both, band-shake 0.28s linear 0.42s;
}
.disposition.disp-deal { border-color: rgba(63,185,80,0.4); background: rgba(63,185,80,0.05); }
.disposition.disp-walk { border-color: rgba(248,81,73,0.4); background: rgba(248,81,73,0.05); }
.disp-stamp {
  font-family: var(--mono); font-size: 0.82rem; font-weight: 700;
  letter-spacing: 0.22em; padding: 0.35rem 0.75rem;
  border: 2px solid currentColor; transform: rotate(-3deg);
}
.disp-deal .disp-stamp { color: var(--good); }
.disp-walk .disp-stamp { color: var(--bad); }
.disp-main { display: flex; align-items: baseline; gap: 0.7rem; }
.disp-big { font-family: var(--mono); font-size: 1.9rem; font-weight: 700; }
.disp-deal .disp-big { color: var(--good); }
.disp-walk .disp-big { color: var(--bad); }
.disp-sub { font-size: 1rem; color: var(--muted); }
.disp-cf { flex-basis: 100%; font-size: 0.8rem; color: var(--muted); border-top: 1px dashed var(--line); padding-top: 0.5rem; }
.disp-cf b { color: var(--ink); }
.disp-cf a { color: var(--accent-bright); }

/* Cross-chart hover */
.traj-row.traj-hot { background: rgba(201,162,39,0.1); }
.traj-link-note {
  margin-top: 0.45rem; font-size: 1rem; color: var(--muted);
  min-height: 1.1rem; opacity: 0; transition: opacity 0.2s;
}
.traj-link-note.visible { opacity: 1; }

/* Exhibit A: the headline row */
.ab-table tr.row-deceptive td { background: rgba(248,81,73,0.05); }

/* Exhibit B: the mechanism a judge can point at */
.ab-table tr.row-causal td { background: rgba(201,162,39,0.07); }
.causal-chip {
  font-family: var(--mono); font-size: 0.56rem; font-weight: 700;
  letter-spacing: 0.1em; color: var(--accent-bright);
  border: 1px solid rgba(201,162,39,0.45); padding: 0.08rem 0.35rem;
  margin-right: 0.35rem; white-space: nowrap;
}

/* Provenance — collapsed by default; researchers open it, judges skip it */
.prov-details > summary {
  cursor: pointer; list-style: none;
  font-family: var(--mono); font-size: 0.8rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.16em; color: var(--ink);
  padding-bottom: 0.5rem; border-bottom: 1px solid var(--line);
}
.prov-details > summary::-webkit-details-marker { display: none; }
.prov-details > summary .sec-no { color: var(--accent); margin-right: 0.74rem; }
.prov-details > summary .hint { letter-spacing: 0; text-transform: none; font-weight: 400; }
.prov-details[open] > summary { margin-bottom: 1rem; }
.prov-card { border: 1px solid var(--line); background: var(--panel); }
.prov-row {
  display: grid; grid-template-columns: 12rem 1fr; gap: 1rem;
  padding: 0.5rem 0.9rem; border-bottom: 1px solid var(--line-soft);
  font-size: 0.82rem; line-height: 1.5;
}
.prov-row:last-child { border-bottom: none; }
.prov-k {
  font-family: var(--mono); font-size: 0.74rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.1em; color: var(--accent);
  align-self: start; padding-top: 0.15rem;
}
.prov-v { color: var(--muted); }
.prov-v code { font-family: var(--mono); color: var(--accent-bright); }
@media (max-width: 720px) { .prov-row { grid-template-columns: 1fr; gap: 0.2rem; } }

/* The causal lever: rerun-without-the-probe-gate */
.ablate-btn {
  background: transparent; color: var(--accent-bright);
  border: 1px solid rgba(201,162,39,0.5); font-family: var(--mono);
  font-size: 0.7rem; font-weight: 600; letter-spacing: 0.04em;
  padding: 0.4rem 1rem; cursor: pointer;
}
.ablate-btn:hover { background: rgba(201,162,39,0.12); }
.ablate-banner {
  padding: 0.5rem 1rem; font-family: var(--mono); font-size: 0.7rem;
  font-weight: 700; letter-spacing: 0.12em; color: var(--accent-bright);
  border: 1px dashed rgba(201,162,39,0.5); background: rgba(201,162,39,0.05);
}

/* Masthead: the two-beat causal story */
.claim-causal {
  margin: 0.35rem 0 0.74rem; font-size: 0.9rem; line-height: 1.55; color: var(--muted);
}
.claim-causal b { color: var(--ink); }
/* Deal-desk workflow: value shown as a loop, not asserted as a noun-list */
/* Standalone band between proceedings and exhibits — align to the page grid. */
.workflow { max-width: 1280px; margin: 0 auto; padding: 1.5rem; }

/* Composer — dial a counterparty nobody pre-authored */
.composer {
  padding: 1rem 1.5rem; border-bottom: 1px solid var(--line-soft); background: var(--panel-2);
  animation: pop 0.25s ease;
  max-width: 1280px; margin: 0 auto;
}
.cmp-lbl {
  display: block; font-family: var(--mono); font-size: 0.74rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.14em; color: var(--accent); margin-bottom: 0.74rem;
}
.cmp-lbl .hint { letter-spacing: 0; text-transform: none; font-weight: 400; }
.cmp-dials { display: flex; align-items: end; gap: 1.4rem; flex-wrap: wrap; }
.cmp-dial {
  display: flex; flex-direction: column; gap: 0.25rem;
  font-family: var(--mono); font-size: 0.74rem; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--muted); min-width: 11rem;
}
.cmp-dial output { font-size: 0.95rem; color: var(--accent-bright); font-weight: 600; letter-spacing: 0; }
.cmp-dial input[type="range"] { width: 100%; accent-color: var(--accent); }
.cmp-check { display: flex; align-items: center; gap: 0.35rem; font-size: 0.8rem; color: var(--ink); cursor: pointer; }
.ft-warn { font-family: var(--sans); font-size: 0.8rem; letter-spacing: 0; text-transform: none; font-weight: 600; color: var(--accent-bright); margin-left: 0.4rem; }
.ft-text {
  width: 100%; box-sizing: border-box; resize: vertical;
  background: var(--bg); color: var(--ink); border: 1px solid var(--line);
  font-family: var(--sans); font-size: 0.85rem; padding: 0.5rem 0.65rem; margin-bottom: 0.74rem;
}
#ft-run, #cmp-run { white-space: nowrap; }
#ft-run {
  background: var(--accent); color: #16110a; border: none; border-radius: 3px;
  padding: 0.5rem 1rem; font-weight: 700; font-size: 0.82rem; cursor: pointer; align-self: end;
}
#ft-run:hover { background: var(--accent-bright); }
#cmp-run {
  background: var(--accent); color: #16110a; border: none; border-radius: 3px;
  padding: 0.5rem 1rem; font-weight: 700; font-size: 0.82rem; cursor: pointer;
}
#cmp-run:hover { background: var(--accent-bright); }
.wf-lbl {
  font-family: var(--mono); font-size: 0.56rem; font-weight: 700;
  letter-spacing: 0.14em; color: var(--accent); display: block; margin-bottom: 0.4rem;
}
.wf-flow { display: flex; align-items: stretch; gap: 0.4rem; flex-wrap: wrap; }
.wf-step {
  font-size: 0.8rem; color: var(--ink); line-height: 1.35;
  background: var(--panel-2); border: 1px solid var(--line);
  padding: 0.35rem 0.55rem; display: flex; align-items: center;
}
.wf-step em { color: var(--muted); font-style: normal; font-size: 0.66rem; }
.wf-core { border-color: rgba(201,162,39,0.5); color: var(--accent-bright); font-weight: 600; }
.wf-core em { color: rgba(227,191,69,0.7); }
.wf-arr { color: var(--accent); align-self: center; font-weight: 700; }
.wf-note { display: block; margin-top: 0.45rem; font-size: 0.7rem; color: var(--muted); line-height: 1.5; }

/* Filed rounds: completed rounds collapse to a one-line story strip —
   THEM → READ → COUNCIL → SENT. Click to reopen the full record. */
/* Outcome-first: a filed round shows only its verdict card; the debate is one click. */
.round.filed > *:not(.round-head):not(.round-verdict) { display: none; }
.round.filed { padding-bottom: 0.74rem; }
.round.filed .round-head { margin-bottom: 0.35rem; }
.round-verdict {
  display: flex; align-items: center; gap: 0.74rem; flex-wrap: wrap;
  font-size: 0.85rem; padding: 0.2rem 0;
}
.rv-flag { color: var(--accent-bright); }
.rv-them { font-family: var(--mono); font-size: 0.8rem; color: var(--muted); }
.rv-arr { color: var(--accent); font-weight: 700; }
.rv-verdict { font-weight: 700; color: var(--good); font-size: 0.98rem; }
.rv-meta { font-size: 0.8rem; color: var(--muted); }
.rv-meta span { font-weight: 600; }
.rv-debate {
  margin-left: auto; background: transparent; color: var(--accent-bright);
  border: 1px solid rgba(201,162,39,0.4); font-family: var(--mono);
  font-size: 0.66rem; letter-spacing: 0.04em; padding: 0.25rem 0.74rem; cursor: pointer;
}
.rv-debate:hover { background: rgba(201,162,39,0.12); }

/* ====== LIVE STAKES HUD — win-probability needle ====== */
.nego-hud {
  position: sticky; top: 60px; z-index: 18;
  max-width: 1280px; margin: 0 auto;
  background: var(--panel); border: 1px solid rgba(201,162,39,0.3);
  border-left: 3px solid var(--accent); padding: 0.74rem 1rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.4);
}
.hud-top { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 0.45rem; }
.hud-round { font-family: var(--mono); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.14em; color: var(--accent); }
.hud-stake { font-size: 0.8rem; color: var(--muted); }
.hud-stake b { font-family: var(--mono); font-size: 1rem; color: var(--ink); }
.hud-delta { font-family: var(--mono); font-size: 0.8rem; margin-left: 0.35rem; }
.hud-delta.up { color: var(--good); }
.hud-delta.dn { color: var(--bad); }
.hud-range { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.7rem; }
.hud-cap { font-family: var(--mono); font-size: 0.56rem; line-height: 1.25; text-align: center; letter-spacing: 0.08em; }
.hud-range .worst { color: var(--bad); }
.hud-range .best { color: var(--good); }
.hud-track {
  position: relative; height: 18px; overflow: hidden;
  background: linear-gradient(to right, rgba(248,81,73,0.22), rgba(201,162,39,0.14) 50%, rgba(63,185,80,0.22));
  border: 1px solid var(--line);
}
.hud-fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: linear-gradient(to right, rgba(63,185,80,0.15), rgba(63,185,80,0.4));
  border-right: 3px solid var(--good);
  transition: width 0.8s cubic-bezier(0.34, 1.3, 0.64, 1);
}
.hud-event { margin-top: 0.4rem; min-height: 1rem; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.04em; color: var(--muted); }
.hud-event.fire { color: var(--accent-bright); animation: hud-flash 0.5s ease; }
.hud-event.win { color: var(--good); }
.hud-event.lose { color: var(--bad); }
.hud-locked .hud-fill { transition: width 0.6s ease; }
@keyframes hud-flash { 0% { opacity: 0; transform: translateY(-3px); } 100% { opacity: 1; transform: none; } }

/* ====== HUMAN-IN-THE-LOOP DOCKS (deceive / duel modes) ====== */
.human-dock {
  border: 1px solid rgba(201,162,39,0.45); background: rgba(201,162,39,0.05);
  padding: 0.75rem 0.9rem;
  animation: verdict-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.human-dock.probed { border-color: var(--accent-bright); box-shadow: 0 0 22px rgba(227,191,69,0.18); }
.human-dock.hd-sent { opacity: 0.5; }
.hd-head { display: flex; align-items: baseline; gap: 0.7rem; flex-wrap: wrap; margin-bottom: 0.4rem; }
.hd-title {
  font-family: var(--mono); font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.14em; color: var(--accent-bright);
}
.hd-brief {
  font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.04em;
  color: var(--muted); margin-bottom: 0.45rem;
  padding: 0.3rem 0.5rem; border: 1px dashed var(--line); background: var(--bg);
}
.hd-brief b { color: var(--ink); }
.hd-probe {
  font-family: var(--mono); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.06em;
  color: var(--accent-bright); margin-bottom: 0.45rem;
  padding: 0.4rem 0.55rem; background: rgba(201,162,39,0.12); border-left: 2px solid var(--accent-bright);
  animation: verdict-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.hd-ctx { margin-bottom: 0.4rem; }
.hd-msg {
  width: 100%; resize: vertical; box-sizing: border-box;
  background: var(--bg); color: var(--ink); border: 1px solid var(--line);
  font-family: var(--sans); font-size: 0.85rem; padding: 0.45rem 0.74rem;
  margin-bottom: 0.45rem;
}
.hd-row { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 0.55rem; }
.hd-lbl { font-family: var(--mono); font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); }
.hd-offer {
  width: 7.5rem; background: var(--bg); color: var(--accent-bright);
  border: 1px solid var(--line); font-family: var(--mono); font-weight: 600;
  font-size: 0.9rem; padding: 0.35rem 0.5rem;
}
.hd-check { font-size: 0.8rem; color: var(--ink); display: inline-flex; align-items: center; gap: 0.3rem; cursor: pointer; }
.hd-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.hd-chips { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.hd-chip {
  background: var(--panel-2); color: var(--ink); border: 1px solid var(--line);
  font-family: var(--mono); font-size: 0.8rem; font-weight: 600; padding: 0.45rem 0.7rem;
  cursor: pointer; transition: border-color 0.15s, background 0.15s;
}
.hd-chip:hover { border-color: var(--accent-bright); background: rgba(201,162,39,0.1); color: var(--accent-bright); }

/* Duel verdict band */
.duel-band { border-color: rgba(201,162,39,0.5); background: rgba(201,162,39,0.05); }
.duel-band .disp-stamp { color: var(--accent-bright); }
.duel-cols { display: flex; gap: 1.6rem; flex-wrap: wrap; }
.duel-col { display: flex; flex-direction: column; min-width: 7rem; opacity: 0.75; }
.duel-col.duel-best { opacity: 1; }
.dc-who { font-family: var(--mono); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.16em; color: var(--muted); }
.dc-val { font-family: var(--mono); font-size: 1.5rem; font-weight: 700; color: var(--ink); }
.duel-best .dc-val { color: var(--good); }
.dc-val.walk { color: var(--bad); }
.dc-sub { font-size: 0.68rem; color: var(--muted); }

/* ====== CINEMA LAYER — the system's mechanics, made dramatic ====== */

/* Convergence beams: five votes flow into one verdict */
.converge {
  position: absolute; top: 0; left: 0;
  pointer-events: none; z-index: 6;
  transition: opacity 0.7s ease;
}
.converge.fade { opacity: 0; }
.beam {
  fill: none; stroke-linecap: square;
  stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: beam-draw 0.45s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.beam-bus {
  stroke: var(--accent-bright); stroke-width: 1.5; opacity: 0.8;
  animation-duration: 0.6s;
}
@keyframes beam-draw { to { stroke-dashoffset: 0; } }

/* Declassification: the truth slides out from under the redaction bar */
.declass {
  flex-basis: 100%; font-size: 0.82rem; color: var(--muted);
  display: flex; align-items: baseline; gap: 0.5rem;
}
.dcl-lbl {
  font-family: var(--mono); font-size: 0.58rem; font-weight: 700;
  letter-spacing: 0.16em; color: var(--muted);
}
.redacted { position: relative; display: inline-block; padding: 0 0.3rem; }
.redacted i { font-style: normal; font-weight: 700; color: var(--ink); }
.redacted::after {
  content: ''; position: absolute; inset: 1px -1px;
  background: var(--ink);
  transform-origin: right center;
  animation: unredact 0.7s cubic-bezier(0.7, 0, 0.2, 1) 1s forwards;
}
@keyframes unredact { to { transform: scaleX(0); } }

/* Stamp slam: the disposition hits like a real stamp */
.disp-stamp, .case-stamp {
  animation: stamp-slam 0.5s cubic-bezier(0.2, 1.4, 0.4, 1) 0.15s both;
}
@keyframes stamp-slam {
  0%   { opacity: 0; transform: rotate(-14deg) scale(2.4); }
  55%  { opacity: 1; transform: rotate(-2deg) scale(0.92); }
  78%  { transform: rotate(-3.6deg) scale(1.05); }
  100% { transform: rotate(-3deg) scale(1); }
}
@keyframes band-shake {
  0%, 100% { translate: 0 0; }
  30% { translate: 1px -1px; }
  60% { translate: -1px 1px; }
  80% { translate: 1px 0; }
}

/* Living spine: a gold current flows while the council deliberates */
body.running #pipeline-rail:not(.complete) .rail-edge {
  background: linear-gradient(90deg, var(--line) 20%, rgba(227,191,69,0.75) 50%, var(--line) 80%);
  background-size: 220% 100%;
  animation: edge-flow 1.7s linear infinite;
}
@keyframes edge-flow {
  from { background-position: 200% 0; }
  to   { background-position: -120% 0; }
}
#pipeline-rail.complete .rail-node i { box-shadow: none; }

/* Disarm flash: a split-second gold wash when the bluff breaks */
.flash-overlay {
  position: fixed; inset: 0; z-index: 90; pointer-events: none;
  background: radial-gradient(ellipse 70% 55% at 50% 38%, rgba(227,191,69,0.20), transparent 70%);
  animation: flash-fade 0.6s ease-out forwards;
}
@keyframes flash-fade {
  0% { opacity: 0; }
  18% { opacity: 1; }
  100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .beam, .disp-stamp, .case-stamp, .disposition, .redacted::after,
  body.running #pipeline-rail:not(.complete) .rail-edge { animation: none !important; }
  .redacted::after { transform: scaleX(0); }
  * { animation-iteration-count: 1 !important; }
}

/* ====== INTERACTIVE TOUR — moving spotlight + terse coachmarks ====== */
.tour-spot {
  position: absolute; z-index: 95; pointer-events: none;
  border: 1px solid var(--accent-bright);
  /* border-radius MUST stay 0: the dimming shadow's corner radius grows by its
     spread, so any radius here becomes a giant black curve across the page. */
  border-radius: 0;
  box-shadow: 0 0 0 100vmax rgba(6, 8, 11, 0.72);
  transition: top 0.45s cubic-bezier(0.4, 0, 0.2, 1), left 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1), height 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
.tour-card {
  position: absolute; z-index: 96; width: 330px;
  background: var(--panel); border: 1px solid rgba(201,162,39,0.5);
  padding: 0.65rem 1rem;
  box-shadow: 0 8px 30px rgba(0,0,0,0.6);
  transition: left 0.45s cubic-bezier(0.4,0,0.2,1), top 0.45s cubic-bezier(0.4,0,0.2,1);
}
.tc-head { font-size: 0.92rem; font-weight: 600; line-height: 1.4; color: var(--ink); }
.tc-more {
  margin-top: 0.45rem; padding-top: 0.45rem; border-top: 1px dashed var(--line);
  font-size: 0.8rem; line-height: 1.55; color: var(--muted);
}
.tc-row { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.55rem; }
.tc-row button {
  background: var(--panel-2); color: var(--ink); border: 1px solid var(--line);
  font-family: var(--mono); font-weight: 700; font-size: 0.8rem;
  padding: 0.2rem 0.74rem; cursor: pointer;
}
.tc-row button:hover { border-color: var(--accent-bright); color: var(--accent-bright); }
.tc-row button:disabled { opacity: 0.35; }
.tc-plus { border-radius: 50%; }
.tc-count { font-family: var(--mono); font-size: 0.8rem; color: var(--muted); margin-right: auto; }
.tc-next { background: var(--accent) !important; color: #16110a !important; border: none !important; }
.tc-end { margin-left: 0.2rem; }

/* ====== RESPONSIVE ====== */
@media (max-width: 980px) {
  .mast-main { grid-template-columns: 1fr; gap: 1.2rem; }
  .mast-claim { justify-self: start; }
  .stat-strip { grid-template-columns: 1fr; }
  .stat { border-right: none; border-bottom: 1px solid var(--line); }
  .stat:last-child { border-bottom: none; }
}

/* ============================================================
   NEW DESIGN-SYSTEM CHROME (ledger/brass) — sticky nav, hero
   council backdrop, footer. Scoped so nothing else is touched.
   ============================================================ */

/* ---- sticky top nav ---- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(20,18,14,0.82); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.site-header .bar {
  max-width: 1240px; margin: 0 auto; padding: 14px 40px;
  display: flex; align-items: center; gap: 28px;
}
.site-header .mark {
  font-family: var(--serif); font-size: 18px; letter-spacing: 0.34em;
  color: var(--fg); text-decoration: none;
}
.site-header .tag {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.24em;
  text-transform: uppercase; color: var(--faint);
}
.site-header nav { margin-left: auto; display: flex; gap: 26px; align-items: center; }
.site-header nav a {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--muted); text-decoration: none;
  padding-bottom: 3px; border-bottom: 1.5px solid transparent; cursor: pointer;
  transition: color .15s, border-color .15s;
}
.site-header nav a:hover { color: var(--fg); }
.site-header .tag.live { color: var(--gold); }
.site-header .tag.live::before {
  content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold); margin-right: 7px; vertical-align: middle;
  animation: hdr-pulse 2.4s ease-in-out infinite;
}
@keyframes hdr-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.25; } }
@media (max-width: 1080px){ .site-header nav a[data-jump]{ display:none; } }
@media (max-width: 620px){
  .site-header .bar { flex-wrap: wrap; row-gap: 2px; }
  .site-header .tag:not(.live){ display:none; }
  .site-header nav { gap: 14px; }
}

/* ---- hero council backdrop graphic + legibility vignette ---- */
.hero .hero-art {
  position: absolute; inset: 0; z-index: 0; opacity: 0.6; pointer-events: none;
}
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(ellipse 56% 52% at 50% 42%,
    rgba(20,18,14,0.74) 0%, rgba(20,18,14,0.34) 46%, transparent 76%);
}
.hero .hero-inner, .hero .scroll-cue { position: relative; z-index: 2; }

/* ---- footer ---- */
.site-footer { border-top: 1px solid var(--line-strong); padding: 54px 0; margin-top: 0; }
.site-footer .ft {
  max-width: 1240px; margin: 0 auto; padding: 0 40px;
  display: flex; gap: 40px; flex-wrap: wrap;
  justify-content: space-between; align-items: flex-start;
}
.site-footer .ftmark {
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--muted); line-height: 1.7; max-width: 22ch;
}
.site-footer .ftcols {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--faint); line-height: 1.9;
}
.site-footer .ftcols.faint { color: var(--faint); opacity: 0.7; }

/* ============================================================
   EDITORIAL LAYOUT (design C) — single-scroll page scaffold.
   Lifted from the synod.css design system; scoped to avoid the
   live components' classes (.lens/.round/.stage keep their own).
   ============================================================ */

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 40px; position: relative; z-index: 1; }

/* type primitives */
.eyebrow b { color: var(--gold); font-weight: 600; }
.eyebrow { font-family: var(--mono); font-size: 12px; font-weight: 500; letter-spacing: 0.34em; text-transform: uppercase; color: var(--gold); display: block; }
.display { font-family: var(--serif); font-weight: 400; line-height: 1.04; letter-spacing: -0.01em; color: var(--fg); margin: 0; }
.serif-italic { font-family: var(--serif); font-style: italic; }
.gold { color: var(--gold); }
.lede { font-size: 1.45rem; line-height: 1.6; color: var(--muted); max-width: 52ch; }
.lede strong, .lede b { color: var(--fg); font-weight: 600; }
.impact-line { font-size: 1.22rem; line-height: 1.6; }
.cap-line { font-family: var(--mono); font-size: 0.8rem; color: var(--faint); letter-spacing: 0.06em; }
/* The 15-second flow — the mental model, above the fold */
.hero-flow { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.3rem 0.4rem; margin: 1rem 0 0.4rem; }
.hero-flow span { font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted);
  padding: 0.3rem 0.55rem; border: 1px solid var(--line); border-radius: 3px; background: var(--panel); }
.hero-flow .hf-lbl { flex-basis: 100%; font-family: var(--mono); font-size: 0.54rem; font-weight: 700; letter-spacing: 0.18em; color: var(--gold-dim); border: none; background: none; padding: 0; margin-bottom: 0.1rem; }
.hero-flow span em { display: block; font-style: normal; text-transform: none; font-size: 0.54rem; color: var(--gold-dim); margin-top: 1px; }
.hero-flow i { font-style: normal; color: var(--gold-dim); font-size: 0.7rem; }
.hero-flow .hf-end { color: var(--ink); border-color: var(--gold-dim); font-weight: 700; }

/* The paired win/loss line — the credibility sentence, above the fold */
.hero-pair { margin: 0.9rem auto 0.5rem; max-width: 640px; font-family: var(--sans); font-size: 0.95rem; line-height: 1.55; color: var(--muted); }
.hero-pair b { color: var(--gold); }
.hero-base { margin: 0.15rem auto 0.4rem; max-width: 640px; font-family: var(--mono); font-size: 0.62rem; color: var(--faint, #6f6552); letter-spacing: 0.02em; }
/* One honest sentence per exhibit, visible WITHOUT expanding */
.ex-take::before { content: "TAKEAWAY — "; font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.09em; color: var(--gold); }
.ex-take { display: block; margin-top: 0.35rem; font-family: var(--sans); font-size: 0.9rem; font-weight: 400; line-height: 1.55;
  color: var(--muted); text-transform: none; letter-spacing: 0; max-width: 92ch; }
.who-bleeds { margin-top: 1rem; max-width: 76ch; font-family: var(--sans); font-size: 0.96rem; line-height: 1.6; color: var(--muted);
  padding: 0.8rem 1rem; background: var(--panel); border-left: 2px solid var(--gold-dim); border-radius: 2px; }
.who-bleeds b { color: var(--ink); }
.who-bleeds a { color: var(--gold); text-decoration: none; }
/* End-of-result transition: same engine, other domain */
.result-cta { display: inline-flex; align-items: center; gap: 0.5rem; cursor: pointer; margin-top: 1.2rem;
  font-family: var(--sans); font-size: 0.98rem; color: var(--ink); text-decoration: none;
  padding: 0.6rem 1rem; border: 1px solid var(--gold-dim); border-radius: 4px; background: var(--panel);
  transition: background 0.15s, border-color 0.15s, transform 0.15s; }
.result-cta b { color: var(--gold); }
.result-cta .rc-arr { color: var(--gold); font-family: var(--mono); transition: transform 0.15s; }
.result-cta:hover { background: var(--panel-2); border-color: var(--gold); }
.result-cta:hover .rc-arr { transform: translateX(4px); }

.hook-line { font-family: var(--serif); font-size: 1.45rem; line-height: 1.45; color: var(--muted); margin: 0.2rem 0 1.4rem; }
.hook-line b { color: var(--gold); }

/* Receipt match — live-and-deterministic, proven in one panel */
.rcpt-match { display: flex; flex-direction: column; gap: 0.15rem; margin-top: 0.9rem; padding: 0.7rem 0.9rem;
  background: var(--panel); border: 1px solid var(--good, #3fb950); border-radius: 3px; font-family: var(--mono); }
.rcpt-match.bad { border-color: var(--risk); }
.rm-k { font-size: 0.56rem; font-weight: 700; letter-spacing: 0.12em; color: var(--muted); margin-bottom: 0.2rem; }
.rm-row { font-size: 0.74rem; color: var(--muted); } .rm-row b { color: var(--ink); margin-left: 0.4rem; }
.rm-verdict { font-size: 0.74rem; font-weight: 700; color: var(--good, #3fb950); margin-top: 0.25rem; }
.rcpt-match.bad .rm-verdict { color: var(--risk); }
.rm-note { font-size: 0.6rem; color: var(--muted); margin-top: 0.15rem; }

/* The creed — the whole idea in four lines, 30 seconds */
.creed { padding: 2.6rem 1.5rem; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: var(--panel); text-align: center; }
.creed p { margin: 0.3rem 0; font-family: var(--serif); font-size: 1.15rem; color: var(--muted); }
.creed .creed-head { font-size: 1.5rem; color: var(--ink); margin-bottom: 0.8rem; }
.creed .creed-head b { color: var(--gold); }
.creed em { color: var(--ink); }

/* §02 — five questions + the flow */
.q5-wrap { display: grid; grid-template-columns: 1.3fr 1fr; gap: 1.6rem; align-items: center; max-width: 860px; margin: 1.4rem 0 1.2rem; }
@media (max-width: 760px) { .q5-wrap { grid-template-columns: 1fr; } }
.q5 { display: flex; flex-direction: column; gap: 0.45rem; }
.q5-i { display: flex; align-items: baseline; gap: 0.7rem; padding: 0.5rem 0.8rem; background: var(--panel); border-left: 3px solid var(--c); border-radius: 2px; }
.q5-i b { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.06em; color: var(--c); min-width: 5.2rem; }
.q5-i span { font-family: var(--serif); font-size: 1rem; color: var(--ink); }
.flow5 { display: flex; flex-direction: column; align-items: center; gap: 0.15rem; }
.flow5 span { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.04em; color: var(--muted); padding: 0.4rem 0.9rem; border: 1px solid var(--line); border-radius: 3px; background: var(--bg-2, #14110c); text-align: center; }
.flow5 i { color: var(--gold-dim); font-size: 0.7rem; font-style: normal; }
.flow5 .flow5-end { color: var(--ink); border-color: var(--gold-dim); font-weight: 700; }

/* collapsed necessity answer + grouped exhibits */
.wno-details { max-width: 760px; margin: 0 0 1.6rem; }
.wno-details > summary { cursor: pointer; font-family: var(--serif); font-style: italic; font-size: 1.02rem; color: var(--gold); padding: 0.5rem 0; }
.wno-details .wno-a { margin-top: 0.4rem; padding: 1rem 1.2rem; background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--gold-dim); border-radius: 3px; }
.ex-group { margin-top: 1.2rem; }
.ex-group > .exhibit { margin-left: 0.6rem; }

/* The global anchor — one sentence, reused verbatim under every section kicker */
.anchor-line { font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.08em; color: var(--faint, #6f6552); text-transform: uppercase; margin: 0.4rem 0 1rem; }
.domain-note { font-family: var(--sans); font-size: 0.92rem; color: var(--muted); max-width: 82ch; margin: -0.4rem 0 1.4rem; }
.domain-note b { color: var(--ink); }
.env-lede { font-family: var(--sans); font-size: 0.92rem; color: var(--muted); margin: 0 0 1.2rem; }
.env-lede b { color: var(--gold); }
.vp-fix { margin-top: 0.6rem; }
.vp-take { font-family: var(--sans); font-size: 0.95rem; color: var(--ink); margin: 0.9rem 0 0; }
.vp-take::before { content: "→ "; color: var(--gold); }
.arch-flow { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.04em; color: var(--muted); margin: 0 0 0.5rem; }
.arch-flow i { color: var(--gold); font-style: normal; }
.arch-flow b { color: var(--ink); }
.arch-key { font-family: var(--sans); font-size: 0.95rem; color: var(--muted); margin: 0 0 1.6rem; }
.ev-takeaway { margin: 2rem 0 0; max-width: 100ch; font-family: var(--serif); font-size: 1.15rem; line-height: 1.6; color: var(--muted);
  padding-left: 1rem; border-left: 3px solid var(--gold); }
.ev-takeaway b { color: var(--ink); }

/* section scaffold */
section { position: relative; z-index: 1; }
.section-pad { padding: 84px 0; }
.section-alt { background: var(--bg-2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.sec-display { font-size: clamp(32px, 4.4vw, 58px); max-width: 20ch; margin-bottom: 30px; }
.section-pad .lede { margin: 0 0 40px; }

.kicker-row { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.kicker-row .idx { font-family: var(--mono); font-size: 12px; color: var(--gold); letter-spacing: 0.1em; }
.kicker-row .lbl { font-family: var(--mono); font-size: 12px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--muted); }
.kicker-row .ln { flex: 1; height: 1px; background: var(--line); }

/* hero C — copy + animated council graphic */
.hero-c { position: relative; padding: 72px 0 64px; border-bottom: 1px solid var(--line); overflow: hidden; }
.hero-c-grid { display: flex; justify-content: center; }
.hero-c-copy { max-width: 720px; text-align: center; }
.hero-c-copy .btn-row { justify-content: center; }
/* The council orb as a full-width breather between the creed and The Result */
.council-gap { display: flex; justify-content: center; padding: 3rem 1.5rem 3.5rem; border-bottom: 1px solid var(--line-soft); }
.council-gap .council { position: relative; width: min(540px, 88vw); height: min(540px, 88vw); }
.hero-c-copy .eyebrow { margin-bottom: 18px; }
.hero-c-h1 { font-size: clamp(42px, 6vw, 84px); margin: 8px 0 22px; line-height: 1.0; }
.hero-c-copy .lede { margin: 0 0 30px; max-width: 46ch; }
.hero-c-copy .cap-line { margin-top: 22px; }
.hero-c-art { position: relative; height: min(56vh, 520px); min-height: 360px; }
@media (max-width: 920px) {
  .hero-c-grid { grid-template-columns: 1fr; gap: 28px; }
  .hero-c-art { height: 320px; min-height: 0; }
}

/* claim ledger */
.ledger { border: 1px solid var(--line-strong); }
.ledger .row { display: grid; grid-template-columns: minmax(150px, 0.4fr) 1fr; gap: 28px; align-items: baseline; padding: 26px 30px; border-bottom: 1px solid var(--line); text-decoration: none; color: inherit; transition: background .16s; }
.ledger .row:last-child { border-bottom: 0; }
.ledger .row:hover { background: var(--panel-2); }
.ledger .stat { font-family: var(--mono); font-weight: 600; font-variant-numeric: tabular-nums; line-height: 0.95; font-size: clamp(38px, 5vw, 64px); }
.ledger .stat.s-walk { color: var(--walk); }
.ledger .stat.s-close { color: var(--close); }
.ledger .stat.s-loss { color: var(--gold); }
.ledger .desc { color: var(--muted); font-size: 1.18rem; line-height: 1.55; }
.ledger .desc b { color: var(--fg); font-weight: 600; }

/* buttons */
.btn { display: inline-flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 0.86rem; letter-spacing: 0.08em; padding: 13px 22px; border: 1px solid var(--line-strong); background: transparent; color: var(--fg); text-decoration: none; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.btn:hover { border-color: var(--gold-dim); color: var(--gold); }
.btn-primary { border-color: var(--gold); color: var(--bg); background: var(--gold); font-weight: 600; }
.btn-primary:hover { background: #d8b35a; color: var(--bg); border-color: #d8b35a; }
.btn-row { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }

/* §02 live tableau + §03 interactive get breathing room inside .wrap */
.scene-council { margin-top: 8px; }
#proceedings .convene-bar { margin: 8px 0 18px; }

/* Evidence headline — the one number a 5-minute judge should leave with */
.ev-headline { margin: 1.2rem 0 1.4rem; padding: 1rem 1.2rem; max-width: 100ch;
  background: var(--panel); border: 1px solid var(--gold-dim); border-radius: 3px; }
.ev-hl-k { display: block; font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.16em; color: var(--gold); margin-bottom: 0.4rem; }
.ev-headline .tw, .ev-headline .tn { font-family: var(--sans); font-size: 1.04rem; line-height: 1.55; color: var(--ink); }
.ev-headline b { color: var(--gold); }

/* The necessity answer — pre-empts "why not one model with five personas?" */
.why-not-one { margin: 1.4rem 0 1.8rem; max-width: 100ch; padding: 1rem 1.2rem;
  background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--gold-dim); border-radius: 3px; }
.wno-q { font-family: var(--serif); font-style: italic; font-size: 1.05rem; color: var(--gold); margin-bottom: 0.5rem; }
.wno-a { font-family: var(--sans); font-size: 0.96rem; line-height: 1.6; color: var(--muted); }
.wno-a b { color: var(--ink); }

/* §04 exhibits */
.exhibit { margin-top: 40px; }
.exhibit:first-of-type { margin-top: 8px; }
.brief-label { font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); margin: 0 0 14px; }
.brief-label .hint { display: block; margin-top: 6px; letter-spacing: 0; }

/* hero-c council graphic legibility (no backdrop now — graphic is in the grid) */
.hero-c::after { content: none; }

/* ============================ THE WAR ROOM ============================ */
.warroom { margin-top: 1.6rem; color: var(--muted); font-family: var(--sans); }
.wr-move {
  display: flex; flex-direction: column; gap: 0.25rem; padding: 1rem 1rem; margin-bottom: 1.4rem;
  background: var(--panel-2); border: 1px solid var(--line); border-left: 2px solid var(--gold-dim);
}
.wr-move-lbl { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.14em; color: var(--muted); }
.wr-move-msg { font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--ink); }
.wr-move-note { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); }

.wr-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 1.6rem; align-items: start; }
@media (max-width: 880px) { .wr-grid { grid-template-columns: 1fr; } }

.wr-gens-lbl { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.06em; color: var(--muted); margin-bottom: 0.5rem; text-transform: uppercase; }
.wr-gens { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.5rem; }
.wr-gen {
  display: flex; flex-direction: column; gap: 0.1rem; text-align: left; cursor: pointer;
  padding: 0.4rem 0.7rem; background: var(--panel); border: 1px solid var(--line);
  color: var(--ink); font-family: var(--sans); transition: border-color 0.15s, background 0.15s;
}
.wr-gen b { font-size: 0.82rem; }
.wr-gen span { font-size: 0.74rem; color: var(--muted); }
.wr-gen:hover { border-color: var(--line-strong); }
.wr-gen.on { border-color: var(--gold); background: var(--gold-wash); }
.wr-loaded { font-family: var(--mono); font-size: 1rem; color: var(--muted); margin: 0.3rem 0 1rem; min-height: 1.1rem; }
.wr-loaded b { color: var(--gold); }

.wr-sliders { display: flex; flex-direction: column; gap: 0.85rem; }
.wr-srow { display: flex; flex-direction: column; gap: 0.25rem; }
.wr-shead { display: flex; justify-content: space-between; align-items: baseline; }
.wr-sname { font-family: var(--mono); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.02em; }
.wr-shead output { font-family: var(--mono); font-size: 0.8rem; color: var(--ink); }
.wr-smath { font-family: var(--mono); font-size: 0.8rem; color: var(--muted); opacity: 0.8; }
.wr-slider { -webkit-appearance: none; appearance: none; width: 100%; height: 4px; border-radius: 2px;
  background: var(--line); outline: none; cursor: pointer; }
.wr-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 15px; height: 15px; border-radius: 50%;
  background: var(--c, var(--gold)); border: 2px solid var(--bg); cursor: pointer; }
.wr-slider::-moz-range-thumb { width: 15px; height: 15px; border-radius: 50%;
  background: var(--c, var(--gold)); border: 2px solid var(--bg); cursor: pointer; }

.wr-right { display: flex; flex-direction: column; gap: 1.2rem; }
.wr-decision { padding: 1rem 1.1rem; background: var(--panel); border: 1px solid var(--line); }
.wr-dec-lbl { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.14em; color: var(--muted); }
.wr-dec-action { font-family: var(--serif); font-size: 1.6rem; color: var(--ink); margin: 0.2rem 0; }
.wr-dec-action.is-chair { color: var(--gold); }
.wr-dec-conf { font-family: var(--mono); font-size: 1rem; color: var(--muted); }
.wr-dec-conf b { color: var(--ink); }

.wr-tools-lbl { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.12em; color: var(--muted); margin-bottom: 0.74rem; }
.wr-tool { margin-bottom: 0.55rem; opacity: 0.6; transition: opacity 0.15s; }
.wr-tool.lead { opacity: 1; }
.wr-tool-top { display: flex; justify-content: space-between; align-items: baseline; }
.wr-tool-name { font-family: var(--mono); font-size: 0.8rem; font-weight: 600; }
.wr-tool-w { font-family: var(--mono); font-size: 0.74rem; color: var(--muted); }
.wr-tool-bar { height: 5px; background: var(--line-soft); border-radius: 2px; margin: 0.18rem 0; overflow: hidden; }
.wr-tool-fill { height: 100%; border-radius: 2px; transition: width 0.12s; }
.wr-tool-fill.neg { opacity: 0.35; }
.wr-tool-math { font-family: var(--mono); font-size: 0.74rem; color: var(--muted); opacity: 0.8; }

.wr-wargame { margin-top: 1.8rem; padding: 1.1rem 1.2rem; background: var(--panel-2); border: 1px solid var(--line); }
.wr-wg-lbl { font-family: var(--mono); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 1rem; text-transform: uppercase; }
.wr-wg-row { display: grid; grid-template-columns: 6.5rem 5rem 1fr 6rem; gap: 0.7rem; align-items: center; margin-bottom: 0.5rem; }
@media (max-width: 680px) { .wr-wg-row { grid-template-columns: 1fr 1fr; } }
.wr-wg-type { font-family: var(--mono); font-size: 0.76rem; color: var(--ink); }
.wr-wg-bel { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); }
.wr-wg-bar { position: relative; height: 18px; background: var(--line-soft); border-radius: 2px; }
.wr-wg-fill { height: 100%; background: var(--gold-dim); border-radius: 2px; }
.wr-wg-val { position: absolute; right: 0.4rem; top: 50%; transform: translateY(-50%); font-family: var(--mono); font-size: 0.68rem; color: var(--ink); }
.wr-wg-arm { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); text-align: right; }
.wr-wg-blend { margin-top: 1rem; padding-top: 0.7rem; border-top: 1px solid var(--line); font-family: var(--mono); font-size: 0.8rem; color: var(--muted); }
.wr-wg-blend b { color: var(--gold); }

/* War room — the room argues (agent-to-agent challenge) */
.wr-argue { padding: 0.9rem 1.1rem; margin-bottom: 1.4rem; background: var(--panel); border: 1px solid var(--line); border-left: 2px solid var(--gold-dim); }
.wr-argue-lbl { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.12em; color: var(--muted); margin-bottom: 0.7rem; }
.wr-turn { display: grid; grid-template-columns: 9.5rem 1fr; gap: 1rem; align-items: baseline; padding: 0.35rem 0; }
.wr-turn-d { border-top: 1px dashed var(--line-soft); }
.wr-turn-who { font-family: var(--mono); font-size: 0.8rem; font-weight: 600; }
.wr-turn-who em { font-style: normal; font-size: 0.8rem; opacity: 0.7; }
.wr-turn-txt { font-family: var(--serif); font-style: italic; font-size: 0.96rem; color: var(--ink); }
.wr-argue-out { margin-top: 0.74rem; padding-top: 0.74rem; border-top: 1px solid var(--line); font-family: var(--mono); font-size: 1rem; color: var(--muted); }
.wr-argue-out b { color: var(--gold); }
.wr-concede { color: var(--probe); }
.wr-hold { color: var(--battle); }
@media (max-width: 680px) { .wr-turn { grid-template-columns: 1fr; gap: 0.2rem; } }

/* ===================== FIT EXPLORER (negotiation table) ===================== */
.fit-lab { margin: 1.4rem 0 2rem; }
.fit-lbl { font-family: var(--mono); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em; color: var(--muted); margin-bottom: 0.7rem; text-transform: uppercase; }
.fit-grid { display: grid; gap: 4px; align-items: stretch; }
.fit-h { font-family: var(--mono); font-size: 0.66rem; font-weight: 600; text-align: center; padding: 0.3rem 0; color: var(--muted); letter-spacing: 0.02em; }
.fit-h.fit-council { color: var(--gold); }
.fit-rowlbl { display: flex; flex-direction: column; justify-content: center; gap: 0.1rem; padding: 0.3rem 0.5rem 0.3rem 0; }
.fit-rowlbl b { font-family: var(--sans); font-size: 1rem; color: var(--ink); }
.fit-rowlbl span { font-family: var(--mono); font-size: 0.58rem; color: var(--muted); line-height: 1.25; }
.fit-cell { position: relative; display: flex; align-items: center; justify-content: center; min-height: 2.5rem;
  font-family: var(--mono); font-size: 0.8rem; color: var(--ink); border: 1px solid var(--line-soft); border-radius: 2px; }
.fit-cell.fit-council { background: var(--gold-wash) !important; border-color: var(--gold-dim); color: var(--gold); font-weight: 600; }
.fit-cell.fit-walk-cell { color: var(--hedge); }
.fit-walk { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.04em; }
.fit-tag { position: absolute; bottom: 2px; right: 4px; font-family: var(--mono); font-size: 0.5rem; color: var(--gold); letter-spacing: 0.02em; }
.fit-why { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); padding: 0.15rem 0 0.55rem; line-height: 1.4; }
@media (max-width: 760px) {
  .fit-grid { grid-template-columns: 6rem repeat(5, 1fr) 3.5rem !important; gap: 2px; }
  .fit-h, .fit-cell { font-size: 0.58rem; }
  .fit-rowlbl b { font-size: 0.66rem; } .fit-rowlbl span { display: none; }
}

/* ===================== LIVE TABS (war room / negotiation) ===================== */
.live-tabs { display: flex; gap: 0.74rem; margin: 1.4rem 0 1.8rem; flex-wrap: wrap; }
.live-tab { display: flex; flex-direction: column; gap: 0.15rem; align-items: flex-start; text-align: left; cursor: pointer;
  padding: 0.74rem 1.1rem; background: var(--panel); border: 1px solid var(--line); color: var(--ink);
  font-family: var(--sans); font-size: 0.98rem; font-weight: 600; transition: border-color 0.15s, background 0.15s; }
.live-tab .lt-sub { font-family: var(--mono); font-size: 0.74rem; font-weight: 400; color: var(--muted); letter-spacing: 0.02em; }
.live-tab:hover { border-color: var(--line-strong); }
.live-tab.on { border-color: var(--gold); background: var(--gold-wash); }
.live-tab.on .lt-sub { color: var(--gold-dim); }
.live-h { font-family: var(--serif); font-size: 1.5rem; color: var(--ink); margin: 0.4rem 0 0.3rem; font-weight: 600; }
.live-sub { font-family: var(--sans); font-size: 1.18rem; color: var(--muted); margin: 0 0 1.2rem; max-width: 100ch; line-height: 1.6; }
.live-sub b { color: var(--ink); }

/* ===================== FEEL THE WEIGHT (war room) ===================== */
.wr-flip { animation: wrflash 0.5s ease-out; }
@keyframes wrflash {
  0% { background: var(--gold); }
  40% { background: rgba(201,164,76,0.25); }
  100% { background: var(--panel); }
}
.wr-flipline { margin-top: 0.5rem; font-family: var(--mono); font-size: 0.7rem; color: var(--gold); letter-spacing: 0.02em; }
.wr-flipline b { color: var(--ink); }
.wr-tool.bearing { background: rgba(201,164,76,0.07); border-left: 2px solid var(--gold); padding-left: 0.5rem; margin-left: -0.5rem; opacity: 1; }
.wr-tool-foot { display: flex; justify-content: space-between; align-items: baseline; gap: 0.74rem; }
.wr-pull { font-family: var(--mono); font-size: 0.74rem; color: var(--muted); white-space: nowrap; }
.wr-pull.bearing { color: var(--gold); }
.wr-pull.bearing b { color: var(--hedge); }

/* ============ SCENARIO BAR — War Room is the star; the deal is a reveal ============ */
.track-bar { position: sticky; top: 0; z-index: 40; background: var(--bg-2); border-bottom: 1px solid var(--line); }
.track-bar-in { display: flex; align-items: center; gap: 1rem; padding: 0.5rem 1.5rem; flex-wrap: wrap; }
/* The standing identity — always names the current scenario, War Room by default */
.track-id { font-family: var(--sans); font-size: 0.98rem; font-weight: 700; color: var(--ink); letter-spacing: 0.01em; white-space: nowrap; }
.track-line { flex: 1 1 12rem; font-family: var(--mono); font-size: 0.68rem; color: var(--muted); letter-spacing: 0.02em; }
.track-line .gold { color: var(--gold-dim); }
/* Subordinate swap — clearly secondary to the War Room, not a co-equal mode button */
.scenario-swap { cursor: pointer; margin-left: auto; white-space: nowrap;
  font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.02em; color: var(--muted);
  background: transparent; border: 1px solid var(--line); border-radius: 3px; padding: 0.35rem 0.7rem;
  transition: color 0.15s, border-color 0.15s, background 0.15s; }
.scenario-swap b { color: var(--gold); font-weight: 700; }
.scenario-swap:hover { color: var(--ink); border-color: var(--gold-dim); background: var(--panel); }
@media (max-width: 640px) { .track-line { display: none; } }

/* throughline callout (kept for any inline use) */
.throughline { margin: 1.2rem 0 1.4rem; padding: 1rem 1.2rem; border: 1px solid var(--line); border-left: 3px solid var(--gold); background: var(--gold-wash); }
.tl-claim { font-family: var(--serif); font-size: 1.4rem; color: var(--ink); margin: 0 0 0.5rem; line-height: 1.4; }
.tl-split { font-size: 1.05rem; }
.tl-spine { font-family: var(--mono); font-size: 0.7rem; color: var(--muted); margin: 0; letter-spacing: 0.02em; }
.tl-spine-k { text-transform: uppercase; color: var(--gold-dim); font-weight: 700; }
.tl-spine b { color: var(--ink); }

/* War room — "watch the council deliberate" play button + staged reveal */
.wr-play { margin-top: 0.74rem; align-self: flex-start; cursor: pointer; font-family: var(--mono);
  font-size: 0.8rem; font-weight: 600; letter-spacing: 0.03em; padding: 0.45rem 0.9rem;
  background: var(--gold); color: #14120e; border: none; border-radius: 3px; transition: filter 0.15s; }
.wr-play:hover { filter: brightness(1.08); }
.wr-stage { opacity: 0; transform: translateY(10px); transition: opacity 0.5s ease, transform 0.5s ease; }
.wr-stage-in { opacity: 1; transform: none; }

/* Fit explorer — emphasize the FIT (category), de-emphasize the dollar */
.fit-headline { font-family: var(--sans); font-size: 1.15rem; color: var(--muted); margin-bottom: 0.9rem; line-height: 1.5; }
.fit-headline b { color: var(--ink); }
.fit-foot { font-family: var(--sans); font-size: 0.92rem; color: var(--muted); margin-top: 0.9rem; line-height: 1.55; max-width: 100ch; }
.fit-foot b { color: var(--gold); } .fit-foot em { color: var(--ink); font-style: italic; }
.fit-fits { font-family: var(--mono); font-size: 0.8rem; font-weight: 700; color: var(--gold); }
.fit-amt { font-family: var(--mono); font-size: 0.7rem; color: var(--muted); opacity: 0.7; }
.fit-cell.fit-best { outline: 2px solid var(--gold); outline-offset: -2px; background: var(--gold-wash) !important; }

/* War room — THE SPLIT is the hero; generals grouped UNDER their position */
.wr-split-lbl { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 0.9rem; text-transform: uppercase; }
.wr-split-hero { display: flex; align-items: stretch; justify-content: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1.6rem; }
.wr-split-col { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.15rem;
  flex: 1; min-width: 130px; padding: 1.1rem 0.8rem; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }
.wr-split-col.win { background: var(--gold-wash); border-color: var(--gold); }
.wr-split-n { font-family: var(--serif); font-size: 3rem; line-height: 1; color: var(--ink); }
.wr-split-col.win .wr-split-n { color: var(--gold); }
.wr-split-act { font-family: var(--sans); font-size: 0.92rem; font-weight: 600; color: var(--muted); text-align: center; }
.wr-split-col.win .wr-split-act { color: var(--ink); }
.wr-split-win { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; color: var(--gold); letter-spacing: 0.02em; margin-top: 0.2rem; }
.wr-split-sep { display: flex; align-items: center; font-family: var(--mono); font-size: 0.7rem; color: var(--line-strong); }
/* grouped: who landed where */
.wr-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 0.8rem; align-items: start; }
.wr-group { padding: 0.5rem 0.6rem; border: 1px solid var(--line-soft); border-radius: 3px; }
.wr-group.win { border-color: var(--gold-dim); background: rgba(201,164,76,0.04); }
.wr-group-h { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 0.5rem; }
.wr-group-act { font-family: var(--sans); font-size: 0.86rem; font-weight: 700; color: var(--ink); }
.wr-group-n { font-family: var(--mono); font-size: 0.6rem; color: var(--muted); }
.wr-group-rows { display: flex; flex-direction: column; gap: 0.4rem; }
.wr-gcard { padding: 0.5rem 0.65rem; background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--muted); border-radius: 2px; }
.wr-gc-head { display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.wr-gc-name { font-family: var(--serif); font-size: 1rem; color: var(--ink); }
.wr-gc-tag { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; margin-left: auto; letter-spacing: 0.02em; }
.wr-gc-proc { font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.02em; color: var(--gold-dim); margin-top: 0.2rem; }
.wr-gc-say { font-family: var(--serif); font-style: italic; font-size: 0.86rem; color: var(--muted); margin-top: 0.25rem; line-height: 1.4; }
.wr-gc-win { color: var(--gold); font-weight: 700; margin-left: 0.3rem; }

/* ===================== WAR ROOM — NUMBERED FLOW ===================== */
.wr-flow { position: relative; }
.wr-step { padding: 0.2rem 0 0.2rem 2.6rem; position: relative; }
.wr-step-h { display: flex; align-items: center; gap: 0.6rem; font-family: var(--mono); font-size: 0.7rem;
  font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink); margin-bottom: 0.7rem; }
.wr-step-n { position: absolute; left: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--gold); color: #14120e;
  font-family: var(--mono); font-size: 0.85rem; font-weight: 700; }
.wr-step-h .wr-play { margin: 0 0 0 auto; }
.wr-conn { padding: 0.4rem 0 0.4rem 0.7rem; margin-left: 0.1rem; border-left: 2px dashed var(--line-strong);
  font-family: var(--mono); font-size: 0.64rem; color: var(--muted); letter-spacing: 0.02em; }
.wr-conn span { opacity: 0.85; }

/* step 4 — the verdict */
.wr-verdict { padding: 0.9rem 1.1rem; background: var(--gold-wash); border: 1px solid var(--gold-dim); border-radius: 3px; }
.wr-verdict-tag { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.14em; color: var(--gold-dim); }
.wr-verdict-act { display: block; font-family: var(--serif); font-size: 1.55rem; color: var(--gold); margin: 0.1rem 0 0.5rem; }
.wr-verdict-why { font-family: var(--sans); font-size: 0.95rem; color: var(--muted); line-height: 1.55; }
.wr-verdict-why b { color: var(--ink); }

/* the interactive coda — your turn */
.wr-coda { margin-top: 2rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.wr-coda-h { font-family: var(--serif); font-size: 1.35rem; color: var(--ink); }
.wr-coda-sub { font-family: var(--sans); font-size: 0.98rem; color: var(--muted); margin: 0.2rem 0 1.2rem; line-height: 1.5; }

/* War room — STEPPER (Terrain → Positions → Debate → Decision → Outcome) */
.wr-stepper { display: flex; align-items: center; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 1.4rem;
  padding: 0.6rem 0.8rem; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }
.wr-stp { display: inline-flex; align-items: center; gap: 0.4rem; font-family: var(--mono); font-size: 0.66rem;
  font-weight: 600; letter-spacing: 0.04em; color: var(--muted); opacity: 0.5; transition: opacity 0.3s, color 0.3s; }
.wr-stp i { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem;
  border-radius: 50%; border: 1px solid var(--line-strong); font-style: normal; font-size: 0.62rem; }
.wr-stp.on { opacity: 1; color: var(--gold); }
.wr-stp.on i { background: var(--gold); color: #14120e; border-color: var(--gold); }
.wr-stp-arr { color: var(--line-strong); font-size: 0.7rem; }


/* War room — arbitration checklist */
.wr-arb-checks { margin: 0.6rem 0 0.7rem; display: flex; flex-direction: column; gap: 0.3rem; }
.wr-arb-f { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); }
.wr-arb-f.on { color: var(--ink); }

/* War room — outcome punch */
.wr-outcome { display: flex; flex-direction: column; gap: 0.15rem; margin-bottom: 1rem; padding: 0.75rem 1rem;
  background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--muted); border-radius: 3px; }
.wr-outcome.win { border-left-color: var(--probe); background: rgba(91,155,214,0.08); }
.wr-outcome-tag { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.14em; color: var(--muted); }
.wr-outcome-line { font-family: var(--serif); font-size: 1.2rem; color: var(--ink); }

/* War room — THE TURNING POINT (causal timeline; pivot emphasized) */
.wr-timeline { margin-bottom: 1.4rem; padding: 1rem 1.1rem; background: var(--panel-2);
  border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 4px; }
.wr-tl-chain { display: flex; align-items: stretch; gap: 0.35rem; overflow-x: auto; padding-bottom: 0.3rem; }
.wr-tl-node { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 0.1rem;
  padding: 0.5rem 0.7rem; min-width: max-content; background: var(--panel); border: 1px solid var(--line);
  border-radius: 3px; opacity: 0.45; transition: opacity 0.35s, border-color 0.35s; }
.wr-tl-node.on { opacity: 1; }
.wr-tl-node b { font-family: var(--sans); font-size: 0.84rem; color: var(--ink); font-weight: 600; white-space: nowrap; }
.wr-tl-sub { font-family: var(--mono); font-size: 0.58rem; color: var(--muted); white-space: nowrap; }
.wr-tl-node.pivot { border-color: var(--gold); background: var(--gold-wash); padding-top: 1.1rem; }
.wr-tl-node.pivot b { color: var(--gold); }
.wr-tl-pivot-tag { position: absolute; top: 0.2rem; left: 0.7rem; font-family: var(--mono); font-size: 0.5rem;
  font-weight: 700; letter-spacing: 0.08em; color: var(--gold-dim); }
.wr-tl-arr { display: flex; align-items: center; color: var(--line-strong); font-size: 0.85rem; flex: 0 0 auto; }
.wr-tl-node.pivot.on ~ .wr-tl-arr, .wr-tl-node.on + .wr-tl-arr { color: var(--gold-dim); }
.wr-tl-thesis { margin-top: 0.8rem; padding-top: 0.7rem; border-top: 1px solid var(--line);
  font-family: var(--sans); font-size: 0.98rem; color: var(--muted); line-height: 1.5; }
.wr-tl-thesis b { color: var(--gold); }

/* War room — LIVE on Qwen (each general reasons for real, on demand) */
.wr-live-btn { margin: 0.6rem 0 0 0.6rem; cursor: pointer; font-family: var(--mono); font-size: 0.72rem;
  font-weight: 600; letter-spacing: 0.02em; padding: 0.45rem 0.9rem; background: transparent;
  color: var(--probe); border: 1px solid var(--probe); border-radius: 3px; transition: background 0.15s; }
.wr-live-btn span { color: var(--muted); font-weight: 400; }
.wr-live-btn:hover { background: rgba(91,155,214,0.12); }
.wr-live-btn:disabled { opacity: 0.5; cursor: default; }
.wr-live-status { display: inline-block; margin-left: 0.7rem; font-family: var(--mono); font-size: 0.66rem; }
.wr-live-status.working { color: var(--probe); }
.wr-live-status.ok { color: var(--probe); }
.wr-live-status.err { color: var(--muted); }
.wr-live-status.warn { color: var(--gold); }
.wr-live-status.warn b { color: var(--ink); }
.wr-live-flag { margin-left: auto; font-family: var(--mono); font-size: 0.6rem; font-weight: 700;
  letter-spacing: 0.04em; color: var(--probe); padding: 0.15rem 0.5rem; border: 1px solid var(--probe); border-radius: 3px; }

/* War room — run bar (tune first, then run the proceedings) */
.wr-runbar { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; margin: 1.6rem 0 0.4rem;
  padding: 1rem 1.1rem; background: var(--panel-2); border: 1px dashed var(--gold-dim); border-radius: 4px; }
.wr-runbar .wr-play { margin: 0; font-size: 0.82rem; padding: 0.55rem 1.1rem; }
.wr-runbar .wr-live-btn { margin: 0; }
.wr-proceedings { margin-top: 0.4rem; }

/* Primary convene CTA — the one unmistakable action in the war room */
.wr-play-primary { display: inline-flex; align-items: center; gap: 0.7rem; padding: 0.7rem 1.3rem !important;
  box-shadow: 0 0 0 1px var(--gold), 0 6px 22px -8px var(--gold); }
.wr-play-primary .wr-play-ico { font-size: 1.1rem; line-height: 1; }
.wr-play-txt { display: flex; flex-direction: column; align-items: flex-start; gap: 0.1rem; text-align: left; }
.wr-play-main { font-size: 0.92rem; font-weight: 700; letter-spacing: 0.02em; text-transform: none; }
.wr-play-sub { font-size: 0.62rem; font-weight: 500; letter-spacing: 0.01em; opacity: 0.8; text-transform: none; }
.wr-play-primary:hover { filter: brightness(1.06); box-shadow: 0 0 0 1px var(--gold), 0 8px 26px -8px var(--gold); }

/* Facing — pick the kind of opponent the live council convenes against */
.wr-facing { flex-basis: 100%; min-width: 0; display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 0.2rem; }
.wr-facing-lbl { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.14em; color: var(--gold); }
.wr-facing select { flex: 1 1 auto; max-width: 100%; min-width: 0; width: auto; }
#wr-scenario { font-family: var(--mono); font-size: 0.72rem; color: var(--ink); background: var(--panel);
  border: 1px solid var(--line-strong); border-radius: 3px; padding: 0.35rem 0.5rem; max-width: 100%; }
.wr-facing .hint { font-size: 0.66rem; }

/* Remove a general, then convene live — the switch-off made causal on a real Qwen run */
.live-map { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.02em; color: var(--muted); margin: -0.4rem 0 1rem; }

/* Removal panel — a distinct, obviously-interactive callout so it's clear you CAN remove one */
.wr-remove { flex-basis: 100%; padding: 0.7rem 0.85rem; margin-bottom: 0.3rem;
  background: var(--panel); border: 1px dashed var(--risk); border-radius: 4px; }
.wr-remove-head { display: block; font-family: var(--mono); font-size: 0.68rem; color: var(--ink); letter-spacing: 0.02em; margin-bottom: 0.55rem; }
.wr-remove-head b { color: var(--ink); }
.wr-opt { display: inline-block; font-size: 0.54rem; font-weight: 700; letter-spacing: 0.14em; color: var(--gold);
  border: 1px solid var(--gold-dim); border-radius: 2px; padding: 0.05rem 0.35rem; margin-right: 0.4rem; }
.wr-remove-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.wr-rm-chip {
  display: inline-flex; align-items: center; gap: 0.4rem; cursor: pointer;
  font-family: var(--mono); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.01em;
  padding: 0.32rem 0.62rem; border-radius: 2px;
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--line); border-bottom: 2px solid var(--c, var(--muted));
  transition: opacity 0.14s, border-color 0.14s, background 0.14s, color 0.14s;
}
.wr-rm-x { color: var(--muted); font-size: 0.62rem; opacity: 0.5; transition: color 0.14s, opacity 0.14s; }
.wr-rm-chip:hover .wr-rm-x { color: var(--risk); opacity: 1; }
.wr-rm-chip i { width: 9px; height: 9px; border-radius: 50%; background: var(--c, var(--muted)); flex: none; transition: opacity 0.14s; }
.wr-rm-lens { color: var(--muted); font-weight: 400; opacity: 0.7; }
.wr-rm-chip:hover { background: var(--panel-2); border-color: var(--risk); }
/* Removed: struck through, greyed, colour key dropped — visibly benched */
.wr-rm-chip.off { color: var(--muted); background: transparent; border-bottom-color: transparent; border-style: dashed; opacity: 0.6; }
.wr-rm-chip.off .wr-rm-name { text-decoration: line-through; }
.wr-rm-chip.off .wr-rm-x { color: var(--risk); opacity: 1; }
.wr-rm-chip.off i { opacity: 0.25; filter: grayscale(1); }
.wr-rm-chip.off::after { content: "removed"; font-size: 0.56rem; color: var(--risk); font-weight: 700; letter-spacing: 0.04em; }

/* War room — THE DELIBERATION (multi-round, all five argue and can move) */
.wr-delib-lbl { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 0.9rem; text-transform: uppercase; }
/* progression grid: rows = generals, cols = rounds */
.wr-pg-wrap { overflow-x: auto; margin-bottom: 1.2rem; }
.wr-pg { display: grid; gap: 3px; min-width: 520px; }
.wr-pg-h { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.06em; color: var(--muted); padding: 0.25rem 0.4rem; text-transform: uppercase; }
.wr-pg-name { display: flex; align-items: center; font-family: var(--serif); font-size: 0.92rem; color: var(--ink); padding: 0.3rem 0.4rem; }
.wr-pg-cell { display: flex; flex-direction: column; gap: 1px; padding: 0.3rem 0.4rem; background: var(--panel); border: 1px solid var(--line-soft); border-radius: 2px; }
.wr-pg-cell.moved { background: rgba(201,164,76,0.12); border-color: var(--gold-dim); }
.wr-pg-call { font-family: var(--sans); font-size: 0.78rem; font-weight: 600; color: var(--ink); }
.wr-pg-lens { font-family: var(--mono); font-size: 0.54rem; }
.wr-pg-lens.lmoved::after { content: " ◂moved"; color: var(--gold); }
/* room split per round */
.wr-room { margin-bottom: 1.2rem; padding: 0.7rem 0.9rem; background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; }
.wr-room-lbl { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 0.5rem; }
.wr-room-row { display: flex; align-items: baseline; gap: 0.8rem; padding: 0.18rem 0; font-family: var(--mono); font-size: 0.72rem; color: var(--muted); flex-wrap: wrap; }
.wr-room-r { color: var(--gold); font-weight: 700; min-width: 1.6rem; }
.wr-room-split b { color: var(--ink); }
.wr-room-lens { color: var(--muted); opacity: 0.75; font-size: 0.64rem; }
/* round-by-round transcript */
.wr-dround { margin-bottom: 0.9rem; }
.wr-dround-h { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; color: var(--gold-dim); margin-bottom: 0.4rem; }
.wr-dturn { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem 0.6rem; padding: 0.3rem 0; border-bottom: 1px solid var(--line-soft); }
.wr-dturn-name { font-family: var(--serif); font-size: 0.96rem; }
.wr-dturn-tag { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; }
.wr-dturn-line { font-family: var(--serif); font-style: italic; font-size: 0.92rem; color: var(--ink); flex: 1 1 60%; }
.wr-shift { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; color: var(--gold); }
.wr-lshift { font-family: var(--mono); font-size: 0.58rem; color: var(--muted); }

/* War room — THE WAR PLAN as a shared Google-Docs-style document: a light "paper" surface,
   contributor presence avatars top-right, each contribution attributed to its general with a
   gutter avatar + colour key, and the general's reasoning as a margin comment. Click a
   contributor avatar to see only their edits (others grey out). */
.wr-plan-empty { font-family: var(--mono); font-size: 0.78rem; color: var(--muted); padding: 0.6rem 0; }

/* The paper */
.gdoc { background: #f2ece0; color: #2a2620; border-radius: 6px; overflow: hidden; box-shadow: 0 12px 44px -14px rgba(0,0,0,0.7); }

/* Doc toolbar: file name + title, and the collaborator presence cluster (right) */
.gdoc-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  padding: 0.7rem 1.1rem; background: #e7dfce; border-bottom: 1px solid #d3c9b2; }
.gdoc-file { font-family: var(--mono); font-size: 0.54rem; font-weight: 700; letter-spacing: 0.12em; color: #8a7f66; }
.gdoc-title { font-family: var(--serif); font-size: 1.06rem; color: #2a2620; margin-top: 0.15rem; }
.gdoc-title b { color: #7a5c00; }
.gdoc-people { display: flex; align-items: center; padding-left: 6px; }

/* Collaborator avatars — overlapping circles, like GDocs presence */
.gdoc-ava { display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  width: 27px; height: 27px; border-radius: 50%; margin-left: -6px; flex: none;
  font-family: var(--mono); font-size: 0.58rem; font-weight: 700; color: #14120e; letter-spacing: 0.02em;
  background: var(--c, #8a7f66); border: 2px solid #e7dfce;
  transition: transform 0.12s ease, box-shadow 0.12s ease; }
.gdoc-ava i { font-style: normal; }
.gdoc-ava.all { background: #b3a88f; font-size: 0.5rem; margin-left: 0; }
.gdoc-ava:hover { transform: translateY(-2px); z-index: 3; }
.gdoc-ava.active { box-shadow: 0 0 0 2px #7a5c00; z-index: 2; }

.gdoc-sub { padding: 0.5rem 1.1rem; font-family: var(--mono); font-size: 0.6rem; color: #8a7f66; border-bottom: 1px solid #e0d7c3; }
.gdoc-sub b { color: #2a2620; }
.gdoc-situation { padding: 0.7rem 1.1rem; font-family: var(--serif); font-style: italic; font-size: 0.92rem; color: #4a4437;
  background: #eae2d2; border-bottom: 1px solid #e0d7c3; }
.gdoc-sk { font-family: var(--mono); font-style: normal; font-size: 0.52rem; font-weight: 700; letter-spacing: 0.1em; color: #8a7f66; margin-right: 0.55rem; }

/* Body: ONE war plan. Passages flow continuously; each carries a faint authorship tint,
   like Google-Docs multi-author highlighting. Hover a contributor → their passages light,
   everyone else's tint drops away. */
.gdoc-body { padding: 0.8rem 1.2rem 0.3rem; }
.wp-para { padding: 0.5rem 0.75rem; margin-bottom: 0.4rem; border-radius: 3px;
  border-left: 3px solid color-mix(in srgb, var(--c, #8a7f66) 45%, transparent);
  background: color-mix(in srgb, var(--c, transparent) 9%, transparent);
  transition: background 0.16s ease, opacity 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease; }
.wp-para.failed { opacity: 0.5; }
.wp-lead { margin: 0; font-family: var(--serif); font-size: 0.98rem; color: #2a2620; line-height: 1.5; }
.wp-lead b { color: #2a2620; }
.wp-tasks { margin: 0.35rem 0 0; padding-left: 1.25rem; }
.wp-tasks li { font-family: var(--sans); font-size: 0.85rem; color: #3a352c; line-height: 1.45; }
.wp-tasks li::marker { color: var(--c, #8a7f66); font-family: var(--mono); font-size: 0.72rem; }
/* focus = this author's passages lit; mute = everyone else's authorship tint removed */
.wp-para.focus { background: color-mix(in srgb, var(--c) 22%, transparent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--c) 40%, transparent); }
.wp-para.mute { background: transparent; border-left-color: #e0d7c3; opacity: 0.5; }

/* The on-focus note: the hovered contributor's "why I own this", as a GDocs comment card */
.gdoc-note { margin: 0.5rem 1.2rem 1rem; min-height: 1rem; }
.gdoc-note.has { display: flex; gap: 0.5rem; padding: 0.55rem 0.7rem; background: #fffef9; border: 1px solid #e0d7c3; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.07); }
.gdoc-note-hint { font-family: var(--mono); font-size: 0.58rem; color: #a99686; padding-left: 0.75rem; }
.gdoc-ava.xs { width: 22px; height: 22px; font-size: 0.48rem; margin: 0; border-color: #fffef9; cursor: default; }
.gdoc-cbody { flex: 1; }
.gdoc-cname { font-family: var(--sans); font-size: 0.74rem; font-weight: 700; color: #2a2620; margin-bottom: 0.15rem; }
.gdoc-creason { font-family: var(--mono); font-size: 0.5rem; font-weight: 700; letter-spacing: 0.06em; color: #a99; margin-left: 0.45rem; text-transform: uppercase; }
.gdoc-cbody p { margin: 0; font-family: var(--sans); font-size: 0.82rem; color: #4a4437; line-height: 1.45; }

/* The cast — who is in the room / at the table (tab-aware) */
.cast { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem 0.7rem; margin: 0 0 1.4rem;
  padding: 0.7rem 1rem; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }
.cast-lbl { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.14em; color: var(--muted); }
.cast-grp { display: inline-flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; }
.cast-grp b { font-family: var(--sans); font-size: 0.84rem; color: var(--ink); }
.cast-sub { font-family: var(--mono); font-size: 0.58rem; color: var(--muted); opacity: 0.8; }
.cast-chip { font-family: var(--mono); font-size: 0.62rem; color: var(--ink); padding: 0.15rem 0.45rem;
  background: var(--bg-2); border: 1px solid var(--line-strong); border-radius: 3px; }
.cast-chip.chair { border-color: var(--gold-dim); color: var(--gold); }
.cast-op { font-family: var(--mono); font-size: 0.72rem; color: var(--line-strong); font-weight: 700; }

/* Architecture — "how the math fits together", in prose */
.mathprose { margin: 1.8rem 0; max-width: 100ch; }
.mp-h { font-family: var(--serif); font-size: 1.5rem; color: var(--ink); margin: 0 0 1rem; font-weight: 600; }
.mathprose p { font-size: 1.12rem; line-height: 1.7; color: var(--muted); margin: 0 0 1rem; }
.mathprose p b { color: var(--ink); font-weight: 600; }
.mathprose p em { font-style: italic; color: var(--ink); }
.mp-formula { display: inline-block; font-family: var(--mono); font-size: 0.92rem; color: var(--gold);
  background: var(--gold-wash); padding: 0.1rem 0.5rem; border-radius: 3px; margin-top: 0.2rem; }
.mathprose code { font-family: var(--mono); font-size: 0.9rem; color: var(--gold); }

/* Evidence — plain-language lead line under each exhibit header */
.ex-lead { font-family: var(--sans); font-size: 1.05rem; line-height: 1.55; color: var(--muted); margin: 0.3rem 0 1rem; max-width: 100ch; }
.ex-lead b { color: var(--ink); font-weight: 600; }

/* Track-aware text: .tw shows only in the war room, .tn only at the negotiation table */
body[data-track="war"] .tn { display: none; }
body[data-track="nego"] .tw { display: none; }
.ev-frame { font-family: var(--mono); font-size: 0.72rem; color: var(--gold-dim); margin: 0 0 1.4rem; letter-spacing: 0.02em; }

/* Architecture — honest boundary (de-walled: a claim line + short follow-ups) */
.validity-note { margin: 2rem 0 0; padding: 1.1rem 1.3rem; background: var(--panel-2); border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 4px; }
.vn-lbl { font-family: var(--mono); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.14em; color: var(--gold-dim); }
.vn-claim { font-family: var(--serif); font-size: 1.25rem; color: var(--ink); margin: 0.45rem 0 0.6rem; line-height: 1.35; }
.vn-detail { font-size: 1rem; line-height: 1.6; color: var(--muted); margin: 0 0 0.45rem; max-width: 100ch; }
.vn-detail b { color: var(--ink); } .vn-detail em { font-style: italic; color: var(--ink); }

/* Architecture — the worked-example calculation line */
.mp-calc { font-family: var(--mono); font-size: 0.92rem; color: var(--gold); background: var(--gold-wash);
  padding: 0.6rem 0.9rem; border-radius: 4px; line-height: 1.9; }
.mp-calc b { color: var(--ink); }

/* Architecture — decision trace (4 beats, the arithmetic is the focal point) */
.trace { max-width: 100ch; margin: 1rem 0 2rem; }
.trace-step { display: grid; grid-template-columns: 7.5rem 1fr; gap: 0.9rem; padding: 0.55rem 0; border-bottom: 1px solid var(--line-soft); align-items: baseline; }
.trace-k { font-family: var(--mono); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.04em; color: var(--gold-dim); text-transform: uppercase; }
.trace-v { font-size: 1.02rem; line-height: 1.5; color: var(--muted); }
.trace-v b { color: var(--ink); } .trace-v em { color: var(--ink); font-style: italic; }
.trace-hero { display: flex; align-items: center; justify-content: center; gap: 1.2rem; margin: 1.1rem 0; padding: 1rem; background: var(--panel-2); border: 1px solid var(--line); border-radius: 6px; }
.th-opt { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); text-align: center; line-height: 1.5; }
.th-opt b { font-family: var(--serif); font-size: 2rem; color: var(--muted); }
.th-opt.win { color: var(--gold); } .th-opt.win b { color: var(--gold); }
.th-vs { font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.1em; color: var(--line-strong); text-transform: uppercase; }
.trace-foot { font-size: 1.02rem; line-height: 1.55; color: var(--muted); }
.trace-foot b { color: var(--ink); } .trace-foot em { color: var(--ink); font-style: italic; }

/* Architecture — "why each piece" accordion (scannable headlines, detail on demand) */
.whyparts { width: 100%; margin: 0.9rem 0 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 2.5rem; align-content: start; }
@media (max-width: 760px) { .whyparts { grid-template-columns: minmax(0, 1fr); } }
.wp-item { min-width: 0; border-bottom: 1px solid var(--line); align-self: start; }
.wp-item > summary { cursor: pointer; list-style: none; padding: 0.85rem 0; font-family: var(--sans); font-size: 1.02rem; font-weight: 600; color: var(--ink); display: flex; align-items: baseline; gap: 0.6rem; }
.wp-item > summary::-webkit-details-marker { display: none; }
.wp-item > summary::before { content: "+"; font-family: var(--mono); color: var(--gold); font-weight: 700; width: 0.8rem; flex: none; }
.wp-item[open] > summary::before { content: "−"; }
.wp-item > p { margin: 0 0 0.95rem 1.4rem; font-size: 0.96rem; line-height: 1.6; color: var(--muted); }
.wp-item > p em { color: var(--ink); font-style: italic; }

/* Evidence — tight question line + answer line + on-demand detail */
.ex-q { font-family: var(--sans); font-size: 1.05rem; line-height: 1.5; color: var(--muted); margin: 0.2rem 0 0.9rem; max-width: 100ch; }
.ab-a { font-size: 1.05rem; line-height: 1.55; color: var(--muted); margin: 0.7rem 0 0; max-width: 100ch; }
.ab-a > b { color: var(--ink); }
.ex-more { display: inline; }
.ex-more > summary { display: inline; cursor: pointer; color: var(--gold-dim); font-family: var(--mono); font-size: 0.72rem; margin-left: 0.4rem; }
.ex-more > summary::-webkit-details-marker { display: none; }
.ex-more > summary::before { content: "ⓘ "; }
.ex-more[open] { display: block; margin-top: 0.4rem; font-size: 0.92rem; line-height: 1.55; color: var(--muted); }
.ex-more[open] > summary { display: block; margin: 0 0 0.2rem; }

/* Evidence — clean reproducibility card (determinism badge, not a terminal dump) */
.repro-card { display: flex; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin: 0 0 1.6rem; padding: 0.9rem 1.1rem; background: var(--panel); border: 1px solid var(--line); border-radius: 5px; }
.repro-left { display: flex; flex-direction: column; gap: 0.5rem; align-items: flex-start; }
.repro-run { cursor: pointer; font-family: var(--mono); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.02em; color: var(--gold); background: transparent; border: 1px solid var(--gold-dim); border-radius: 3px; padding: 0.3rem 0.6rem; }
.repro-run:hover { background: var(--gold-wash); }
.repro-badge { font-family: var(--mono); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.02em; color: var(--muted); padding: 0.35rem 0.7rem; border: 1px solid var(--line-strong); border-radius: 4px; }
.repro-badge.ok { color: #14120e; background: var(--probe); border-color: var(--probe); }
.repro-badge.bad { color: #14120e; background: var(--hedge); border-color: var(--hedge); }
.repro-note { flex: 1; min-width: 16rem; font-size: 0.98rem; line-height: 1.55; color: var(--muted); margin: 0; }
.repro-note b { color: var(--ink); } .repro-note code { font-family: var(--mono); font-size: 0.86rem; color: var(--gold); }

/* War room — the verifiable "read the room and move" artifact */
.wr-influence { margin: 0.4rem 0 1.4rem; padding: 0.9rem 1.1rem; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 5px; }
.wr-inf-lbl { font-family: var(--mono); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em; color: var(--gold); margin-bottom: 0.7rem; }
.wr-inf-room-h { font-family: var(--mono); font-size: 0.64rem; color: var(--muted); margin-bottom: 0.4rem; }
.wr-inf-room { padding: 0.6rem 0.7rem; background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; }
.wr-inf-row { display: grid; grid-template-columns: 6.5rem 4rem 1fr; gap: 0.6rem; align-items: baseline; padding: 0.2rem 0; }
.wr-inf-who { font-family: var(--serif); font-size: 0.92rem; }
.wr-inf-call { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); }
.wr-inf-line { font-family: var(--serif); font-style: italic; font-size: 0.88rem; color: var(--ink); }
.wr-inf-arrow { font-family: var(--mono); font-size: 0.66rem; color: var(--gold-dim); margin: 0.6rem 0 0.3rem; display: block; }
.wr-inf-resp-line { font-family: var(--serif); font-style: italic; font-size: 1rem; color: var(--ink); padding-left: 0.7rem; border-left: 2px solid var(--gold); }
.wr-inf-shift { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); margin-top: 0.5rem; }
.wr-inf-shift b { color: var(--gold); }
.wr-inf-cause { color: var(--probe); }
@media (max-width: 640px) { .wr-inf-row { grid-template-columns: 1fr; gap: 0.1rem; } }


/* War room — the recon-capability artifact (belief resolves vs stalls) */
.capability { margin: 1.8rem 0 0.4rem; padding: 1.1rem 1.2rem; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 5px; }
.cap-h { font-family: var(--serif); font-size: 1.25rem; color: var(--ink); margin-bottom: 0.4rem; }
.cap-h b { color: var(--gold); }
.cap-sub { font-family: var(--sans); font-size: 0.98rem; line-height: 1.55; color: var(--muted); margin: 0 0 1rem; max-width: 100ch; }
.cap-sub em { color: var(--ink); font-style: italic; }
.cap-cap { font-family: var(--sans); font-size: 0.98rem; line-height: 1.55; color: var(--muted); margin: 0 0 0.6rem; max-width: 100ch;
  padding-left: 0.7rem; border-left: 2px solid var(--gold-dim); }
.cap-cap b { color: var(--ink); }
.cap-cols { display: flex; align-items: stretch; gap: 1rem; flex-wrap: wrap; }
.cap-col { flex: 1; min-width: 220px; padding: 0.8rem 0.9rem; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }
.cap-col.with { border-color: var(--probe); }
.cap-col-h { font-family: var(--mono); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.06em; color: var(--muted); margin-bottom: 0.7rem; }
.cap-col.with .cap-col-h { color: var(--probe); }
.cap-trace { display: flex; align-items: flex-end; gap: 0.7rem; height: 80px; padding-bottom: 1.1rem; border-bottom: 1px solid var(--line-soft); }
.cap-bar { position: relative; flex: 1; height: 100%; display: flex; align-items: flex-end; }
.cap-bar i { display: block; width: 100%; background: var(--muted); border-radius: 2px 2px 0 0; }
.cap-col.with .cap-bar i { background: var(--probe); }
.cap-bar-v { position: absolute; top: -0.9rem; left: 0; right: 0; text-align: center; font-family: var(--mono); font-size: 0.56rem; color: var(--muted); }
.cap-bar-r { position: absolute; bottom: -1rem; left: 0; right: 0; text-align: center; font-family: var(--mono); font-size: 0.56rem; color: var(--muted); }
.cap-meta { font-family: var(--mono); font-size: 0.68rem; color: var(--muted); margin-top: 0.5rem; }
.cap-meta b { color: var(--ink); }
.cap-out { font-family: var(--serif); font-size: 1.15rem; color: var(--muted); margin-top: 0.5rem; }
.cap-out.close { color: var(--probe); }
.cap-vs { display: flex; align-items: center; font-family: var(--mono); font-size: 0.7rem; color: var(--line-strong); }
.cap-foot { font-family: var(--sans); font-size: 0.98rem; line-height: 1.55; color: var(--muted); margin: 1rem 0 0; max-width: 100ch; }
.cap-foot b { color: var(--ink); } .cap-foot em { color: var(--ink); font-style: italic; }

/* Exhibit G — the real-transcript rung */
.tr-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; max-width: 720px; }
@media (max-width: 640px) { .tr-cols { grid-template-columns: 1fr; } }
.tr-col { padding: 1rem 1.1rem; border-radius: 3px; background: var(--panel); border: 1px solid var(--line); }
.tr-col b:first-child { display: block; font-family: var(--serif); font-size: 2rem; line-height: 1.1; margin-bottom: 0.3rem; }
.tr-col.win b:first-child { color: var(--good, #3fb950); }
.tr-col.lose b:first-child { color: var(--risk); }
.tr-col span { font-family: var(--sans); font-size: 0.85rem; line-height: 1.5; color: var(--muted); }
.tr-col span b { color: var(--ink); }
.tr-note { margin-top: 0.7rem; font-family: var(--mono); font-size: 0.62rem; line-height: 1.6; color: var(--muted); max-width: 86ch; }
.tr-note code { color: var(--gold-dim); }

/* Exhibit F — literature opponents (ANAC baselines) */
.anac-grid { display: flex; flex-direction: column; gap: 0.4rem; }
.anac-row { display: grid; grid-template-columns: minmax(220px, 1.6fr) 1fr 1fr 1fr; gap: 0.6rem; align-items: center;
  padding: 0.5rem 0.7rem; background: var(--panel); border: 1px solid var(--line-soft); border-radius: 2px; }
.anac-name { font-family: var(--sans); font-size: 0.88rem; color: var(--ink); }
.anac-cell { font-family: var(--mono); font-size: 0.78rem; color: var(--muted); }
.anac-cell b { color: var(--ink); }
.anac-verdict { font-family: var(--mono); font-size: 0.72rem; font-weight: 700; text-align: right; }
.anac-win { color: var(--good, #3fb950); }
.anac-lose { color: var(--risk); }
.anac-tie { color: var(--muted); }

/* Cross-opponent switch-off matrix — the decisive general changes with who you face */
.switch-matrix-wrap { margin-top: 1.5rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.sm-h { font-family: var(--serif); font-size: 1.08rem; color: var(--ink); margin-bottom: 0.3rem; }
.sm-h b { color: var(--ink); }
.sm-sub { font-family: var(--sans); font-size: 0.92rem; color: var(--muted); margin: 0 0 0.9rem; max-width: 100ch; }
.sm-grid { overflow-x: auto; }
.sm-row { display: grid; grid-template-columns: 160px repeat(5, 1fr); gap: 4px; min-width: 560px; margin-bottom: 4px; }
.sm-op { display: flex; flex-direction: column; justify-content: center; font-family: var(--mono); font-size: 0.68rem; color: var(--ink); padding: 0.3rem 0.4rem; }
.sm-full { color: var(--muted); font-size: 0.54rem; margin-top: 2px; }
.sm-cell { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  font-family: var(--mono); font-size: 0.82rem; color: var(--muted); padding: 0.5rem 0.3rem;
  background: var(--panel); border: 1px solid var(--line-soft); border-radius: 2px; }
.sm-h-cell { font-size: 0.64rem; font-weight: 700; gap: 2px; background: transparent; border: none; padding-bottom: 0.2rem; }
.sm-cog { font-size: 0.5rem; font-weight: 400; opacity: 0.7; }
.sm-cell.loss { color: var(--ink); font-weight: 700; }
.sm-cell.decisive { background: color-mix(in srgb, var(--c) 26%, var(--panel)); border: 1px solid var(--c); color: #fff; font-weight: 700; box-shadow: 0 0 0 1px var(--c); }
.sm-take { font-family: var(--sans); font-size: 0.94rem; color: var(--muted); line-height: 1.55; margin: 1rem 0 0; max-width: 88ch; }
.sm-take b { color: var(--ink); } .sm-take em { color: var(--ink); font-style: italic; }
.sm-ho { font-family: var(--mono); font-style: normal; font-size: 0.5rem; font-weight: 700; letter-spacing: 0.08em; color: var(--gold-dim);
  border: 1px solid var(--gold-dim); border-radius: 2px; padding: 0 0.25rem; margin-left: 0.35rem; vertical-align: middle; }

/* Capability — interactive switch-off buttons + "of 3,000" outcome */
.cap-btns { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.9rem; }
.cap-btn { cursor: pointer; font-family: var(--mono); font-size: 0.66rem; color: var(--muted); background: var(--bg-2); border: 1px solid var(--line-strong); border-radius: 3px; padding: 0.35rem 0.6rem; }
.cap-btn:hover { border-color: var(--gold-dim); color: var(--ink); }
.cap-btn.active { color: #14120e; background: var(--gold); border-color: var(--gold); }
.cap-btn-lens { opacity: 0.7; }
.cap-of { font-family: var(--mono); font-size: 0.62rem; color: var(--muted); }
.cap-note { font-family: var(--sans); font-size: 0.98rem; line-height: 1.55; color: var(--muted); margin: 0.9rem 0 0; max-width: 100ch; }
.cap-note b { color: var(--ink); } .cap-note em { color: var(--ink); font-style: italic; }

/* Architecture — the MCP tool panel (Synod as an MCP server, invocable live) */
.mcp-panel { margin: 1.6rem 0; padding: 1.1rem 1.2rem; background: var(--panel-2); border: 1px solid var(--line); border-left: 3px solid var(--gold-dim); border-radius: 5px; }
.mcp-h { font-family: var(--serif); font-size: 1.2rem; color: var(--ink); margin-bottom: 0.3rem; }
.mcp-h b { color: var(--gold); }
.mcp-sub { font-family: var(--sans); font-size: 0.95rem; line-height: 1.5; color: var(--muted); margin: 0 0 0.9rem; max-width: 74ch; }
.mcp-sub code { font-family: var(--mono); font-size: 0.84rem; color: var(--gold); }
.mcp-tools { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.mcp-tool { font-family: var(--mono); font-size: 0.66rem; color: var(--muted); background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; padding: 0.35rem 0.6rem; }
.mcp-tool.live { cursor: pointer; color: var(--gold); border-color: var(--gold-dim); }
.mcp-tool.live:hover { background: var(--gold-wash); }
.mcp-tool[disabled] { opacity: 0.6; }
.mcp-io { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0.8rem; margin-top: 0.9rem; }
@media (max-width: 720px) { .mcp-io { grid-template-columns: minmax(0,1fr); } }
.mcp-io-col { min-width: 0; }
.mcp-io-lbl { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.04em; color: var(--gold-dim); margin-bottom: 0.3rem; }
.mcp-io pre { font-family: var(--mono); font-size: 0.66rem; line-height: 1.45; color: var(--ink); background: #0e0c08; border: 1px solid var(--line); border-radius: 4px; padding: 0.7rem 0.8rem; margin: 0; overflow-x: auto; white-space: pre; max-height: 280px; overflow-y: auto; }
.mcp-wait { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); }

/* A real agent consulting the council — the recorded MCP-consumption run */
.mcp-agent { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px dashed var(--line-strong); }
.ma-head { font-family: var(--serif); font-size: 1.02rem; color: var(--ink); margin-bottom: 0.7rem; }
.ma-step { display: grid; grid-template-columns: 118px 1fr; gap: 0.7rem; padding: 0.45rem 0; border-bottom: 1px solid var(--line-soft); }
.ma-step:last-child { border-bottom: none; }
.ma-who { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.08em; color: var(--muted); padding-top: 0.2rem; }
.ma-step.call .ma-who, .ma-step.result .ma-who { color: var(--gold); }
.ma-step.decide .ma-who { color: var(--good, #3fb950); }
.ma-body { font-family: var(--sans); font-size: 0.86rem; line-height: 1.55; color: var(--ink); min-width: 0; }
.ma-body code { font-family: var(--mono); font-size: 0.72rem; color: var(--gold); }
.ma-body pre { font-family: var(--mono); font-size: 0.62rem; line-height: 1.45; color: var(--muted); background: #0e0c08; border: 1px solid var(--line); border-radius: 4px; padding: 0.6rem 0.7rem; margin: 0.4rem 0 0; overflow-x: auto; max-height: 260px; overflow-y: auto; white-space: pre-wrap; }
.ma-body summary { cursor: pointer; font-family: var(--mono); font-size: 0.66rem; color: var(--muted); }

.prior-art { max-width: 100ch; margin: 1.6rem 0 1rem; font-family: var(--sans); font-size: 0.88rem; line-height: 1.6; color: var(--muted);
  padding: 0.7rem 0.9rem; background: var(--panel); border-left: 2px solid var(--muted); border-radius: 2px; }
.prior-art b { color: var(--ink); }
.prior-art a { color: var(--gold); text-decoration: none; }
.ftcols a { color: var(--muted); text-decoration: none; }
.ftcols a:hover { color: var(--gold); }

/* ============ §05 WHY IT MATTERS — the value proposition ============ */
.vp-problem { max-width: 76ch; margin: 0 0 1.6rem; }
.vp-problem p { font-family: var(--sans); font-size: 1.04rem; line-height: 1.65; color: var(--muted); margin: 0; }
.vp-problem b, .vp-problem em { color: var(--ink); }
.vp-proof { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0.7rem; margin: 0 0 2.2rem; }
.vp-chip { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.85rem 1rem; text-decoration: none;
  background: var(--panel); border: 1px solid var(--line); border-top: 2px solid var(--gold-dim); border-radius: 3px;
  transition: border-color 0.15s, background 0.15s; }
.vp-chip:hover { border-color: var(--gold); background: var(--panel-2); }
.vp-chip b { font-family: var(--serif); font-size: 1.35rem; color: var(--gold); }
.vp-chip span { font-family: var(--sans); font-size: 0.8rem; line-height: 1.4; color: var(--muted); }
.vp-h { font-family: var(--serif); font-size: 1.3rem; color: var(--ink); margin: 2rem 0 0.3rem; }
.vp-sub { font-family: var(--sans); font-size: 0.95rem; color: var(--muted); margin: 0 0 1rem; max-width: 100ch; }
.vp-sub b { color: var(--ink); }
.vp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 0.8rem; }
.vp-card { padding: 0.9rem 1rem; background: var(--panel); border: 1px solid var(--line); border-radius: 3px; }
.vp-ind { font-family: var(--sans); font-size: 0.95rem; font-weight: 700; color: var(--ink); margin-bottom: 0.35rem; }
.vp-card p { margin: 0; font-family: var(--sans); font-size: 0.86rem; line-height: 1.55; color: var(--muted); }
.vp-adopt { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0.8rem; }
.vp-lane { padding: 0.9rem 1rem; background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--gold-dim); border-radius: 3px;
  font-family: var(--sans); font-size: 0.88rem; line-height: 1.55; color: var(--muted); }
.vp-lane b { display: block; color: var(--ink); margin-bottom: 0.25rem; }
.vp-lane a { color: var(--gold); text-decoration: none; }
.vp-honest { margin: 1.8rem 0 0; max-width: 100ch; font-family: var(--sans); font-size: 0.9rem; line-height: 1.6; color: var(--muted);
  padding: 0.8rem 1rem; border: 1px dashed var(--line-strong); border-radius: 3px; }
.vp-honest b { color: var(--ink); }
/* ANL / NegMAS recorded results */
.vp-anl { margin-bottom: 0.6rem; font-family: var(--mono); font-size: 0.72rem; color: var(--muted); }
.vp-anl-grid { display: flex; flex-direction: column; gap: 0.4rem; }
.vp-anl-row { display: grid; grid-template-columns: minmax(230px, 1.7fr) 1fr 1fr 1.1fr; gap: 0.6rem; align-items: center;
  padding: 0.55rem 0.75rem; background: var(--panel); border: 1px solid var(--line-soft); border-radius: 2px; }
.vp-anl-row.head { background: transparent; border: none; padding-bottom: 0.1rem; }
.vp-anl-row.head span { font-family: var(--mono); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.1em; color: var(--muted); text-transform: uppercase; }
.vp-anl-name { font-family: var(--sans); font-size: 0.88rem; color: var(--ink); }
.vp-anl-name i { display: block; font-style: normal; font-family: var(--mono); font-size: 0.56rem; color: var(--gold-dim); margin-top: 2px; }
.vp-anl-cell { font-family: var(--mono); font-size: 0.8rem; color: var(--muted); }
.vp-anl-cell b { color: var(--ink); }
.vp-anl-out { font-family: var(--mono); font-size: 0.74rem; font-weight: 700; }
.vp-anl-out.deal { color: var(--good, #3fb950); }
.vp-anl-out.nodeal { color: var(--muted); }
.vp-anl-note { margin-top: 0.6rem; font-family: var(--mono); font-size: 0.62rem; color: var(--muted); }
.vp-anl-note code { color: var(--gold-dim); }
.vp-of { font-size: 0.64rem; color: var(--muted); }
/* One headline story; the rest folded away */
.vp-hero { padding: 1.1rem 1.2rem; background: var(--panel); border: 1px solid var(--gold-dim); border-radius: 4px; margin-bottom: 0.7rem; }
.vp-hero-num { font-family: var(--serif); font-size: 2.2rem; color: var(--gold); line-height: 1.1; margin-bottom: 0.45rem; }
.vp-hero-num span { font-family: var(--sans); font-size: 0.95rem; color: var(--muted); margin-left: 0.5rem; }
.vp-hero-txt { font-family: var(--sans); font-size: 0.98rem; line-height: 1.6; color: var(--muted); max-width: 82ch; }
.vp-hero-txt b { color: var(--ink); }
.vp-hero .vp-trace { padding: 0.4rem 0 0; }
.vp-rest { margin-bottom: 0.6rem; }
.vp-rest > summary { cursor: pointer; font-family: var(--mono); font-size: 0.7rem; color: var(--muted); padding: 0.4rem 0; }
.vp-rest > summary:hover { color: var(--ink); }
.vp-rest-row { display: flex; flex-wrap: wrap; gap: 0.4rem 1rem; align-items: baseline; padding: 0.5rem 0.7rem; margin-top: 0.35rem;
  background: var(--panel); border: 1px solid var(--line-soft); border-radius: 2px; }
.vp-rest-name { font-family: var(--sans); font-size: 0.9rem; color: var(--ink); min-width: 240px; }
.vp-rest-name i { font-style: normal; font-family: var(--mono); font-size: 0.56rem; color: var(--gold-dim); margin-left: 0.4rem; }
.vp-rest-out { font-family: var(--sans); font-size: 0.86rem; color: var(--muted); }
.vp-rest-out b { color: var(--ink); }
.vp-rest .vp-trace { margin: 0 0 0.2rem; padding: 0 0.7rem 0.2rem; }
.vp-setup { margin: 0 0 1rem; max-width: 86ch; padding: 0.7rem 0.9rem; font-family: var(--sans); font-size: 0.9rem; line-height: 1.55;
  color: var(--muted); background: var(--panel); border-left: 2px solid var(--gold-dim); border-radius: 2px; }
.vp-setup b { color: var(--ink); }
/* Round-by-round council reasoning, per recorded game */
.vp-trace { margin: -0.1rem 0 0.5rem; padding: 0 0.75rem 0.4rem; }
.vp-trace summary { cursor: pointer; font-family: var(--mono); font-size: 0.66rem; color: var(--gold-dim); padding: 0.3rem 0; }
.vp-trace summary:hover { color: var(--gold); }
.vp-tr-grid { display: flex; flex-direction: column; gap: 3px; margin-top: 0.3rem; }
.vp-tr-row { display: grid; grid-template-columns: 2rem minmax(120px, 0.8fr) minmax(150px, 1fr) 2.4fr; gap: 0.6rem; align-items: baseline;
  padding: 0.35rem 0.5rem; background: var(--bg-2, #14110c); border: 1px solid var(--line-soft); border-radius: 2px; }
.vp-tr-r { font-family: var(--mono); font-size: 0.6rem; font-weight: 700; color: var(--gold-dim); }
.vp-tr-them { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); }
.vp-tr-them b, .vp-tr-us b { color: var(--ink); }
.vp-tr-us { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); }
.vp-tr-why { font-family: var(--sans); font-size: 0.78rem; line-height: 1.45; color: var(--muted); font-style: italic; }
@media (max-width: 760px) { .vp-tr-row { grid-template-columns: 2rem 1fr; } .vp-tr-why { grid-column: 1 / -1; } }

/* §06 — the system in one picture (the boundary is the diagram) */
.arch-d { max-width: 860px; margin: 1.6rem 0 2rem; font-family: var(--mono); }
.ad-row { padding: 0.6rem 0.9rem; background: var(--panel); border: 1px solid var(--line); border-radius: 3px; display: flex; gap: 0.8rem; align-items: baseline; flex-wrap: wrap; }
.ad-row b { font-size: 0.7rem; letter-spacing: 0.1em; color: var(--ink); }
.ad-row span { font-size: 0.66rem; color: var(--muted); }
.ad-arr { text-align: center; font-size: 0.66rem; color: var(--gold-dim); padding: 0.3rem 0; }
.ad-split { display: grid; grid-template-columns: 1fr auto 1fr; gap: 0.6rem; margin-top: 0.6rem; align-items: stretch; }
.ad-box { padding: 0.8rem 0.9rem; border-radius: 3px; display: flex; flex-direction: column; gap: 0.35rem; }
.ad-box b { font-size: 0.66rem; letter-spacing: 0.06em; }
.ad-box span { font-size: 0.68rem; line-height: 1.5; color: var(--muted); font-family: var(--sans); }
.ad-box i { font-style: normal; font-size: 0.56rem; color: var(--gold-dim); }
.ad-code { background: var(--panel); border: 1px solid var(--line-strong); }
.ad-code b { color: var(--ink); }
.ad-qwen { background: rgba(91,155,214,0.06); border: 1px solid rgba(91,155,214,0.35); }
.ad-qwen b { color: var(--probe, #5b9bd6); }
.ad-bound { display: flex; align-items: center; text-align: center; font-size: 0.54rem; font-weight: 700; letter-spacing: 0.12em; color: var(--gold); line-height: 1.7; padding: 0 0.2rem; }
.ad-feet { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.6rem; margin-top: 0.6rem; }
.ad-foot { padding: 0.55rem 0.8rem; background: var(--bg-2, #14110c); border: 1px dashed var(--line-strong); border-radius: 3px; }
.ad-foot b { display: block; font-size: 0.6rem; letter-spacing: 0.1em; color: var(--gold-dim); margin-bottom: 0.15rem; }
.ad-foot span { font-size: 0.66rem; color: var(--muted); font-family: var(--sans); line-height: 1.45; }
@media (max-width: 720px) { .ad-split { grid-template-columns: 1fr; } .ad-bound { padding: 0.3rem 0; line-height: 1.3; } .ad-bound br { display: none; } }
.arch-triad { font-family: var(--serif); font-size: 1.25rem; line-height: 1.7; color: var(--ink); margin: 1rem 0 1.8rem; padding-left: 1rem; border-left: 3px solid var(--gold); }
.arch-b { max-width: 100ch; margin: 0.2rem 0 0.8rem; padding-left: 1.4rem; display: flex; flex-direction: column; gap: 0.35rem; }
.arch-b li { font-family: var(--sans); font-size: 0.96rem; line-height: 1.5; color: var(--muted); }
.arch-b li b { color: var(--ink); }
.flow5-names { display: block; font-style: normal; margin-top: 0.3rem; }
.flow5-names b { font-size: 0.6rem; margin: 0 0.2rem; }

/* the three questions */
.arch-q { max-width: 100ch; font-family: var(--sans); font-size: 0.98rem; line-height: 1.65; color: var(--muted); margin: 0.4rem 0 1.6rem; }
.arch-q b { color: var(--ink); }

/* Two-axis clarifiers (judgment vs labor) */
.cap-axis { font-family: var(--mono); font-size: 0.72rem; line-height: 1.55; color: var(--gold-dim); margin: 0 0 0.9rem; max-width: 74ch; }
.cap-axis b { color: var(--ink); } .cap-axis em { color: var(--ink); font-style: italic; }
.wr-plan-axis { font-family: var(--mono); font-size: 0.66rem; line-height: 1.5; color: var(--gold-dim); margin: 0.5rem 0 0.9rem; }
.wr-plan-axis b { color: var(--ink); }

/* War room — did the debate change the call? (causality, honest either way) */
.wr-causal { font-family: var(--sans); font-size: 0.98rem; line-height: 1.55; margin: 0 0 1rem; padding: 0.7rem 0.9rem; border-radius: 4px; }
.wr-causal b { color: var(--ink); }
.wr-causal.yes { background: var(--gold-wash); border: 1px solid var(--gold-dim); color: var(--muted); }
.wr-causal.no { background: var(--panel); border: 1px solid var(--line); color: var(--muted); }

/* War room — adaptive participation: who the chair convened vs sat out */
.wr-benched { font-family: var(--sans); font-size: 0.95rem; line-height: 1.55; color: var(--muted); margin: 0 0 1rem; padding: 0.7rem 0.9rem; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 4px; }
.wr-benched b { color: var(--ink); }
.wr-bench-x { color: var(--muted); } .wr-bench-x i { color: var(--gold-dim); font-style: normal; }

/* press feedback — the interface confirms it heard you */
button:active:not(:disabled), .result-cta:active, .scenario-swap:active { transform: scale(0.97); }

/* hero citation — quiet, scholarly */
.lede .cite { font-family: var(--mono); font-size: 0.72rem; color: var(--faint, #6f6552); letter-spacing: 0.02em; white-space: nowrap; }

/* §02 — the two ways a society can resolve disagreement */
.hyp-cmp { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; margin: 1.2rem 0 0.5rem; max-width: 100ch; }
.hc-col { display: flex; flex-direction: column; gap: 0.3rem; padding: 0.9rem 1rem; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }
.hc-col b { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.3rem; }
.hc-col span { font-family: var(--sans); font-size: 0.9rem; color: var(--muted); }
.hc-col i { color: var(--line-strong); font-style: normal; font-size: 0.8rem; }
.hc-synod { border-color: var(--gold-dim, #8a6d1f); }
.hc-synod b, .hc-synod i { color: var(--gold); }
.hc-synod span { color: var(--ink); }
.hc-proof { font-family: var(--sans); font-size: 0.92rem; color: var(--muted); max-width: 100ch; margin: 0 0 1.6rem; }
.hc-proof b { color: var(--ink); }
@media (max-width: 620px){ .hyp-cmp { grid-template-columns: 1fr; } }

/* honest boundary — proven vs not yet */
.vn-cols { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem; margin: 0.7rem 0; }
.vn-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.35rem; }
.vn-list li { font-family: var(--sans); font-size: 0.9rem; color: var(--muted); padding-left: 1.3rem; position: relative; line-height: 1.45; }
.vn-yes li::before { content: "✓"; position: absolute; left: 0; color: var(--good, #5fa96b); font-weight: 700; }
.vn-no li::before { content: "✗"; position: absolute; left: 0; color: var(--bad, #c05b4d); font-weight: 700; }
@media (max-width: 620px){ .vn-cols { grid-template-columns: 1fr; } }

#evidence .prov-details { margin-top: 2rem; }

/* ---- the staged opening ---- */
.hero-stage .hs-pin { display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 4.5rem 24px 3rem; position: relative; }
.hs-h1 { margin: 0; }
.hs-line { display: block; font-family: var(--serif); font-weight: 500; font-size: clamp(2.2rem, 6vw, 4.4rem);
  line-height: 1.12; color: var(--fg); letter-spacing: -0.01em; }
.hs-l2 { margin-top: 0.4em; color: var(--gold); }
.hs-cite { display: block; margin-top: 1.1rem; font-family: var(--mono); font-style: normal;
  font-size: 0.68rem; letter-spacing: 0.14em; color: var(--muted); }
.hs-cue { position: absolute; top: calc(50% + 6.5rem + 7vh); left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 0.15rem;
  font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--muted); }
.hs-cue i { font-style: normal; animation: hs-bob 2s ease-in-out infinite; color: var(--gold); }
@keyframes hs-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
/* staged mode (JS + motion allowed): pin the viewport, beats crossfade by scroll */
.hero-stage.hs-active .hs-track { height: 230vh; }
.hero-stage.hs-active .hs-pin { position: sticky; top: 0; height: 100vh; }
.hero-stage.hs-active .hs-line { position: absolute; left: 24px; right: 24px; top: 50%; translate: 0 -50%; will-change: transform, opacity; }
.hero-stage.hs-active .hs-l2 { opacity: 0; margin-top: 0; }

.hero-close { margin-top: 1.4rem; font-family: var(--serif); font-size: 1.25rem; letter-spacing: 0.01em; color: var(--ink); }
.hc-general { font-family: var(--sans); font-size: 0.92rem; color: var(--muted); max-width: 100ch; margin: -0.8rem 0 1.6rem; }
.hc-general b { color: var(--ink); }
.ev-external { font-family: var(--sans); font-size: 0.95rem; color: var(--ink); margin: 2rem 0 1rem; padding-left: 1rem; border-left: 3px solid var(--gold); }

/* the creed, seated on the council itself */
.creed-fused { position: relative; overflow: hidden; padding: 3rem 1.5rem; min-height: 640px;
  display: flex; align-items: center; justify-content: center; }
@media (max-width: 620px){
  .creed-fused { min-height: 100vw; }
  .creed-art .council { opacity: 0.3; }
  .creed-fused .creed-copy { background: radial-gradient(ellipse 75% 80% at 50% 50%, rgba(20,18,14,0.95) 45%, rgba(20,18,14,0) 78%); }
}
.creed-art { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.creed-art .council { position: relative; width: min(560px, 92vw); height: min(560px, 92vw); opacity: 0.6; }
.creed-fused .creed-copy { position: relative; z-index: 1;
  background: radial-gradient(ellipse 60% 70% at 50% 50%, rgba(20,18,14,0.88) 38%, rgba(20,18,14,0) 72%);
  padding: 3.5rem 1rem; }

/* ---- earned motion (Emil pass) ---- */
:root { --ease-strong: cubic-bezier(0.23, 1, 0.32, 1); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

/* one-time entrances: opacity+transform only, ease-out, under 450ms */
.motion-ok [data-reveal] { opacity: 0; transform: translateY(12px);
  transition: opacity 0.45s var(--ease-strong), transform 0.45s var(--ease-strong); }
.motion-ok [data-reveal].in-view { opacity: 1; transform: none; }
.motion-ok [data-reveal-stagger] > * { opacity: 0; transform: translateY(10px);
  transition: opacity 0.4s var(--ease-strong), transform 0.4s var(--ease-strong); }
.motion-ok [data-reveal-stagger].in-view > * { opacity: 1; transform: none; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(2) { transition-delay: 50ms; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(3) { transition-delay: 100ms; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(4) { transition-delay: 150ms; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(5) { transition-delay: 200ms; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(6) { transition-delay: 250ms; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(7) { transition-delay: 300ms; }
.motion-ok [data-reveal-stagger].in-view > *:nth-child(8) { transition-delay: 350ms; }

/* war ⇄ deal swap: the incoming pane arrives, never jars (display toggle restarts this) */
@media (prefers-reduced-motion: no-preference) {
  .track-pane { animation: pane-in 220ms var(--ease-strong); }
  @keyframes pane-in { from { opacity: 0; transform: translateY(6px); } }
}

/* details open: content settles in (block children only; 200ms) */
@media (prefers-reduced-motion: no-preference) {
  details[open] > *:not(summary) { animation: det-in 200ms var(--ease-strong); }
  @keyframes det-in { from { opacity: 0; transform: translateY(4px); } }
}

.run-sub { font-family: var(--serif); font-size: 1.2rem; color: var(--muted); margin: -0.6rem 0 1.4rem; }

.hf-cap { font-family: var(--sans); font-size: 0.9rem; color: var(--muted); margin: 0.5rem 0 0; }
.proof-payoff { font-family: var(--serif); font-size: 1.15rem; color: var(--gold); margin: 1rem 0 0.4rem; }

.arch-chain { list-style: none; margin: 0 0 1.8rem; padding: 0; display: flex; flex-direction: column; gap: 0.35rem; max-width: 70ch; }
.arch-chain li { font-family: var(--sans); font-size: 0.95rem; color: var(--muted); }
.arch-chain b { color: var(--ink); }

/* removal experiment appears after the first run */
#live-war:not(.has-run) #wr-remove { display: none; }
#live-war:not(.has-run2) .cap-fold { display: none; }
/* the final rung reads like the climax it is */
.ex-climax { border-left: 3px solid var(--gold); padding-left: 1rem; }
.ex-climax .ex-take { font-size: 1rem; color: var(--ink); }
.ma-fold { margin-top: 0.5rem; }

/* deal pane: the lab controls appear after the first run */
#proceedings:not(.has-run) #fit-lab,
#proceedings:not(.has-run2) #compose-btn,
#proceedings:not(.has-run) #speed-btn,
#proceedings:not(.has-run) #guide-btn { display: none; }
#exhibit-league .vp-anl { margin-top: 0.6rem; }

/* the page suggests the next experiment, one at a time */
.run-next { display: none; font-family: var(--sans); font-size: 0.92rem; color: var(--gold); margin: 0.8rem 0 0; }
#live-war.has-run .run-next, #proceedings.has-run .run-next { display: block; }

.vp-null { font-family: var(--sans); font-size: 0.9rem; color: var(--muted); margin: 0.4rem 0 0; }

/* the chair carries the visual weight; the transcript is opt-in */
.wr-step[data-step="4"] { border: 1px solid var(--gold-dim, #8a6d1f); border-left: 3px solid var(--gold); background: var(--gold-wash, rgba(201,162,39,0.05)); }
.wr-step[data-step="4"] .wr-step-h { font-size: 1.15em; }
.wr-chair-crest { font-family: var(--serif); font-size: 1.15rem; color: var(--ink); margin: 0.2rem 0 0.8rem; }
.wr-arg-fold > summary { cursor: pointer; font-family: var(--sans); font-size: 0.95rem; color: var(--muted); list-style: none; }
.wr-arg-fold > summary::-webkit-details-marker { display: none; }
.wr-arg-fold[open] > summary { margin-bottom: 0.8rem; }

/* explicit permission to stop — the hierarchy, said out loud */
.stop-line { margin: 2.5rem 0 0; padding: 1rem 1.2rem; border: 1px solid var(--line); border-left: 3px solid var(--gold);
  font-family: var(--serif); font-size: 1.1rem; line-height: 1.55; color: var(--muted); background: var(--panel); }
.stop-line b { color: var(--ink); }

.wr-contrast { margin-top: 0.9rem; padding: 0.7rem 0.9rem; border-left: 3px solid var(--probe, #5b9bd6);
  font-family: var(--sans); font-size: 0.92rem; color: var(--muted); background: var(--panel); }
.wr-contrast b { color: var(--ink); }

/* step 4's handoff strip: input → read → call */
.wr-handoff { display: flex; align-items: stretch; gap: 0.5rem; flex-wrap: wrap; margin: 0 0 1rem; }
.wr-handoff .wh-item { display: flex; flex-direction: column; gap: 0.15rem; padding: 0.5rem 0.8rem;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 3px;
  font-family: var(--sans); font-size: 0.9rem; color: var(--ink); }
.wr-handoff .wh-item b { font-family: var(--mono); font-size: 0.56rem; font-weight: 700;
  letter-spacing: 0.12em; color: var(--muted); }
.wr-handoff i { align-self: center; font-style: normal; color: var(--gold-dim, #8a6d1f); }
.wr-handoff .wh-call { border-color: var(--gold); }
.wr-handoff .wh-call b { color: var(--gold); }

.tr-verdict { margin: 0.7rem 0 0.4rem; font-family: var(--serif); font-size: 1.05rem; line-height: 1.5; color: var(--ink); max-width: 72ch; }
.tr-verdict b { color: var(--gold); }