/* ============================================================================
 * Casting Vote — a debating chamber for two in-browser models and one human.
 * Hansard paper by day, the chamber at night. Seat A is amber ink, seat B is
 * slate, the chair is baize green. Speeches set in Caslon like the record.
 * Light is the default; the site's toggle adds body.dark-mode.
 * ==========================================================================*/

body.cv-page {
  --cv-bg: #f2f3ee;
  --cv-panel: #fbfbf8;
  --cv-panel-2: #eceee7;
  --cv-line: #d5d9cf;
  --cv-line-strong: #b9bfb3;
  --cv-ink: #18201b;
  --cv-dim: #545e57;
  --cv-faint: #6f7971;
  --cv-chair: #1d7550;
  --cv-chair-soft: #dcebe2;
  --cv-a: #95560f;
  --cv-a-soft: #f3e6d2;
  --cv-b: #37599f;
  --cv-b-soft: #e0e7f4;
  --cv-err: #b0352b;
  --cv-shadow: 0 1px 2px rgba(24, 32, 27, 0.06), 0 8px 24px rgba(24, 32, 27, 0.06);

  --cv-serif: "Libre Caslon Text", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --cv-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cv-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* labs-modern is dark-first; bridge its tokens to this page's light ground */
  --lab-bg: var(--cv-bg);
  --lab-surface: var(--cv-panel);
  --lab-surface-2: var(--cv-panel-2);
  --lab-border: var(--cv-line);
  --lab-border-strong: var(--cv-line-strong);
  --lab-ink: var(--cv-ink);
  --lab-ink-dim: var(--cv-dim);
  --lab-ink-faint: var(--cv-faint);
  --lab-shadow: var(--cv-shadow);
  --lab-shadow-lg: 0 16px 40px rgba(24, 32, 27, 0.14);

  background: var(--cv-bg);
  color: var(--cv-ink);
  font-family: var(--cv-sans);
  font-size: 16px;
  line-height: 1.55;
  margin: 0;
}

/* Motion tokens (Emil Kowalski): strong ease-out for UI, never ease-in. */
body.cv-page {
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --cv-brass: #a67c2e;
  --cv-grain-opacity: 0.05;
}
body.cv-page.dark-mode { --cv-brass: #d7a54e; --cv-grain-opacity: 0.035; }

/* A static paper grain, fixed, never animated: texture without movement. */
body.cv-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: var(--cv-grain-opacity);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.cv-page .cv, .cv-page #siteHeader { position: relative; z-index: 1; }

body.cv-page.dark-mode {
  --cv-bg: #0b0f0d;
  --cv-panel: #121814;
  --cv-panel-2: #19211c;
  --cv-line: #28322b;
  --cv-line-strong: #3a463d;
  --cv-ink: #e6ebe5;
  --cv-dim: #a3ada5;
  --cv-faint: #858f87;
  --cv-chair: #5cc596;
  --cv-chair-soft: #163629;
  --cv-a: #e6ab60;
  --cv-a-soft: #36270f;
  --cv-b: #9db8f0;
  --cv-b-soft: #1b2843;
  --cv-err: #f08a80;
  --cv-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 30px rgba(0, 0, 0, 0.35);
  --lab-shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.5);
}

.cv-page [hidden] { display: none !important; }

.cv {
  max-width: 1080px;
  margin: 0 auto;
  padding-inline: 20px;
  padding-block: 88px 160px;
  display: grid;
  gap: 28px;
}

.cv-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.cv-eyebrow {
  margin: 0;
  font: 500 12px/1.3 var(--cv-mono);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--cv-faint);
}

.cv-h2 {
  margin: 0;
  font: 700 1.25rem/1.25 var(--cv-serif);
  color: var(--cv-ink);
  text-wrap: balance;
}

.cv-quiet { color: var(--cv-faint); font-weight: 400; }
.cv-fine { margin: 0; font-size: 13.5px; color: var(--cv-faint); max-width: 70ch; }
.cv-mono { font-family: var(--cv-mono); font-size: 12px; }
.cv-error { color: var(--cv-err); margin: 0; }

/* ── masthead ─────────────────────────────────────────────────────────── */
.cv-mast { display: grid; gap: 8px; }
.cv-title {
  margin: 0;
  font: 700 clamp(2.4rem, 5.5vw, 3.6rem)/1.02 var(--cv-serif);
  letter-spacing: -0.015em;
  color: var(--cv-ink);
}
.cv-dek {
  margin: 0;
  max-width: 60ch;
  font: 400 1.12rem/1.55 var(--cv-serif);
  color: var(--cv-dim);
  text-wrap: pretty;
}

/* ── order paper ──────────────────────────────────────────────────────── */
.cv-order, .cv-summary, .cv-division, .cv-record {
  background: var(--cv-panel);
  border: 1px solid var(--cv-line);
  border-radius: 12px;
  box-shadow: var(--cv-shadow);
}

.cv-order { padding: 24px; display: grid; gap: 18px; }
.cv-order-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }

.cv-gpu-alert {
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid var(--cv-err);
  color: var(--cv-err);
  background: transparent;
}

.cv-label {
  display: block;
  font: 600 13px/1.3 var(--cv-sans);
  color: var(--cv-dim);
  margin-bottom: 6px;
  padding: 0;
}

.cv-motion {
  width: 100%;
  box-sizing: border-box;
  resize: vertical;
  min-height: 3.2em;
  padding: 6px 2px 10px;
  border: 0;
  border-bottom: 2px solid var(--cv-line-strong);
  background: transparent;
  color: var(--cv-ink);
  font: 400 clamp(1.25rem, 2.6vw, 1.6rem)/1.35 var(--cv-serif);
  border-radius: 0;
}
.cv-motion:focus-visible { outline: none; border-bottom-color: var(--cv-chair); }

.cv-examples { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: -6px; }
.cv-example {
  padding: 2px 0;
  border: 0;
  background: none;
  color: var(--cv-dim);
  font: 400 13.5px/1.4 var(--cv-sans);
  text-align: left;
  text-decoration: underline dotted var(--cv-line-strong);
  text-underline-offset: 3px;
  cursor: pointer;
}
.cv-example:hover { color: var(--cv-chair); text-decoration-color: var(--cv-chair); }

.cv-seg {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 2px;
  padding: 3px;
  border-radius: 999px;
  background: var(--cv-panel-2);
  border: 1px solid var(--cv-line);
}
.cv-seg-btn {
  border: 0;
  background: transparent;
  color: var(--cv-dim);
  font: 500 14px/1.2 var(--cv-sans);
  padding: 7px 14px;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.cv-seg-btn:hover { color: var(--cv-ink); }
.cv-seg-btn[aria-checked="true"] {
  background: var(--cv-panel);
  color: var(--cv-ink);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), inset 0 0 0 1px var(--cv-line-strong);
}
.cv-seg-sub { font-size: 12px; color: var(--cv-faint); font-weight: 400; }

.cv-seats {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: stretch;
  gap: 14px;
}
.cv-seat-pick {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--cv-line);
  background: var(--cv-bg);
}
.cv-seat-pick[data-seat="A"] { box-shadow: inset 0 3px 0 var(--cv-a); }
.cv-seat-pick[data-seat="B"] { box-shadow: inset 0 3px 0 var(--cv-b); }
.cv-seat-tag { display: flex; align-items: center; gap: 8px; font: 600 14px/1.2 var(--cv-sans); }
.cv-versus { align-self: center; font: 400 italic 1.3rem/1 var(--cv-serif); color: var(--cv-faint); }
.cv-seat-note { margin: 0; font-size: 13px; color: var(--cv-faint); font-variant-numeric: tabular-nums; }

.cv-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; display: inline-block; }
.cv-dot-a { background: var(--cv-a); }
.cv-dot-b { background: var(--cv-b); }

.cv-side {
  font: 500 11px/1 var(--cv-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 7px 3px;
  border-radius: 4px;
  color: var(--cv-dim);
  background: var(--cv-panel-2);
}
.cv-seat-a .cv-side, .cv-seat-pick[data-seat="A"] .cv-side { color: var(--cv-a); background: var(--cv-a-soft); }
.cv-seat-b .cv-side, .cv-seat-pick[data-seat="B"] .cv-side { color: var(--cv-b); background: var(--cv-b-soft); }

.cv-select, .cv-input {
  width: 100%;
  box-sizing: border-box;
  min-height: 40px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--cv-line-strong);
  background: var(--cv-panel);
  color: var(--cv-ink);
  font: 400 15px/1.3 var(--cv-sans);
}
.cv-select-sm { width: auto; min-height: 32px; padding: 4px 8px; font-size: 13px; }

.cv-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; }
.cv-row-top { align-items: flex-start; justify-content: flex-start; }
.cv-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.cv-presets .lab-chip { font-size: 13px; font-weight: 400; color: var(--cv-dim); background: transparent; }
.cv-presets .lab-chip b { font-weight: 600; color: var(--cv-ink); }
.cv-presets .lab-chip[aria-pressed="true"] { border-color: var(--cv-chair); background: var(--cv-chair-soft); color: var(--cv-ink); }
.cv-budget { margin: 0; font-size: 13.5px; color: var(--cv-dim); font-variant-numeric: tabular-nums; max-width: 46ch; }

.cv-field { border: 0; margin: 0; padding: 0; min-width: 0; }

.cv-open { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding-top: 4px; border-top: 1px solid var(--cv-line); padding-block-start: 18px; }
.cv-open-btn { min-height: 46px; padding: 0 22px; font-size: 16px; }

/* ── summary (during a sitting) ───────────────────────────────────────── */
.cv-summary { padding: 16px 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.cv-summary-main { display: grid; gap: 4px; min-width: 0; flex: 1 1 260px; }
.cv-summary-motion { margin: 0; font: 400 1.3rem/1.3 var(--cv-serif); text-wrap: balance; }
.cv-summary-seats { margin: 0; font-size: 13.5px; color: var(--cv-dim); }

/* ── the floor ────────────────────────────────────────────────────────── */
.cv-floor { display: grid; gap: 22px; }
.cv-howto { padding: 4px 2px; display: grid; gap: 10px; }
.cv-steps { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; max-width: 72ch; color: var(--cv-dim); }
.cv-steps b { color: var(--cv-ink); font-weight: 600; }

.cv-round { display: grid; gap: 10px; }
.cv-round-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid var(--cv-line); padding-bottom: 6px; }
.cv-round-title { margin: 0; font: 400 italic 1.2rem/1.2 var(--cv-serif); color: var(--cv-ink); }
.cv-round-note { font: 500 11px/1 var(--cv-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--cv-faint); }

.cv-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.cv-pair-single { grid-template-columns: minmax(0, 1fr); max-width: 680px; }
.cv-slot { display: contents; }

.cv-speech {
  background: var(--cv-panel);
  border: 1px solid var(--cv-line);
  border-radius: 10px;
  padding: 14px 16px 12px;
  display: grid;
  gap: 8px;
  min-width: 0;
}
.cv-speech.cv-seat-a { border-top: 2px solid var(--cv-a); }
.cv-speech.cv-seat-b { border-top: 2px solid var(--cv-b); }
.cv-speech[data-status="waiting"] { background: transparent; border-style: dashed; border-top-style: dashed; }
.cv-speech-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cv-speech-who { font: 600 14px/1.2 var(--cv-sans); }
.cv-speech-state { margin-left: auto; font: 500 11px/1 var(--cv-mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--cv-faint); }
.cv-speech[data-status="speaking"] .cv-speech-state { color: var(--cv-chair); }
.cv-speech[data-status="interrupted"] .cv-speech-state,
.cv-speech[data-status="error"] .cv-speech-state { color: var(--cv-err); }
.cv-speech[data-status="speaking"] .cv-dot { animation: cv-breathe 1.2s ease-in-out infinite; }

.cv-speech-body { font: 400 16.5px/1.62 var(--cv-serif); color: var(--cv-ink); overflow-wrap: anywhere; }
.cv-speech-body p { margin: 0 0 0.7em; max-width: 68ch; }
.cv-speech-body p:last-child { margin-bottom: 0; }
.cv-speech-body .cv-quiet { font: 400 14px/1.5 var(--cv-sans); }

.cv-caret {
  display: inline-block;
  width: 0.5em;
  height: 1em;
  margin-left: 2px;
  vertical-align: -0.12em;
  background: var(--cv-chair);
  opacity: 0.7;
  animation: cv-blink 1s steps(2, start) infinite;
}

/* Sentences carrying figures, studies or sources: underlined, never hidden. */
.cv-claim {
  text-decoration: underline dotted color-mix(in srgb, var(--cv-a) 70%, var(--cv-faint));
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
  cursor: help;
}
.cv-legend { margin: 0; font-size: 13px; color: var(--cv-faint); }
.cv-legend .cv-claim { color: var(--cv-dim); cursor: default; }
.cv-flag { color: var(--cv-err); font-weight: 500; flex-basis: 100%; }
.cv-speech[data-repeat="true"] .cv-speech-state { color: var(--cv-err); }

.cv-receipt { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--cv-faint); font-variant-numeric: tabular-nums; }
.cv-receipt:empty { display: none; }
.cv-receipt .cv-mono { font-size: 11.5px; }

.cv-chair-line {
  justify-self: center;
  max-width: 640px;
  text-align: center;
  display: grid;
  gap: 2px;
  padding: 6px 12px;
}
.cv-chair-tag { font: 500 11px/1.2 var(--cv-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--cv-chair); }
.cv-chair-text { margin: 0; font: 400 italic 1.1rem/1.45 var(--cv-serif); color: var(--cv-ink); }

.cv-thread { display: grid; gap: 12px; }
.cv-turn { display: grid; max-width: min(720px, 88%); }
.cv-turn-a { justify-self: start; }
.cv-turn-b { justify-self: end; }
.cv-thread .cv-chair-line { justify-self: center; }

.cv-improv-rules { max-width: 48ch; align-self: center; }

/* The cast list: a small playbill before the scene. */
.cv-playbill {
  justify-self: center;
  width: min(100%, 560px);
  box-sizing: border-box;
  text-align: center;
  display: grid;
  gap: 8px;
  padding: 18px 20px 16px;
  border: 1px solid var(--cv-line-strong);
  border-radius: 10px;
  background: var(--cv-panel);
}
.cv-playbill-kicker { margin: 0; font: 500 11px/1.2 var(--cv-mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--cv-chair); }
.cv-playbill-suggestion { margin: 0; font: 400 italic 1.15rem/1.35 var(--cv-serif); color: var(--cv-ink); text-wrap: balance; }
.cv-playbill[data-state="casting"] .cv-playbill-kicker::after { content: ""; }
.cv-cast { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; text-align: left; }
.cv-cast-row { display: grid; grid-template-columns: auto auto 1fr; align-items: baseline; gap: 2px 10px; padding: 8px 12px; border-radius: 8px; background: var(--cv-bg); }
.cv-cast-row .cv-dot { align-self: center; }
.cv-cast-name { font: 700 1.05rem/1.2 var(--cv-serif); }
.cv-seat-a .cv-cast-name { color: var(--cv-a); }
.cv-seat-b .cv-cast-name { color: var(--cv-b); }
.cv-cast-role { font-size: 14px; color: var(--cv-dim); min-width: 0; }
.cv-cast-by { grid-column: 2 / -1; font: 12px/1.3 var(--cv-mono); color: var(--cv-faint); }
.cv-playbill-where { margin: 0; font-size: 13.5px; color: var(--cv-dim); }
.cv-speech-by { font: 12px/1 var(--cv-mono); color: var(--cv-faint); }
.cv-move {
  font: 500 11px/1 var(--cv-mono);
  letter-spacing: 0.04em;
  padding: 4px 7px 3px;
  border-radius: 4px;
  color: var(--cv-chair);
  background: var(--cv-chair-soft);
  white-space: nowrap;
}
.cv-cast-want { grid-column: 2 / -1; font: italic 13px/1.35 var(--cv-serif); color: var(--cv-dim); }
.cv-note { color: var(--cv-chair); flex-basis: 100%; font-style: italic; }
/* Visible reasoning: quieter than the speech, readable, and folded once the words start. */
.cv-think {
  border-left: 2px solid var(--cv-line-strong);
  padding: 2px 0 2px 10px;
  color: var(--cv-faint);
}
.cv-think[open] { border-left-color: var(--cv-brass); }
.cv-think-summary {
  cursor: pointer;
  font: 500 11.5px/1.3 var(--cv-mono);
  letter-spacing: 0.04em;
  color: var(--cv-dim);
  list-style: none;
}
.cv-think-summary::-webkit-details-marker { display: none; }
.cv-think-summary::before { content: "▸ "; color: var(--cv-brass); }
.cv-think[open] .cv-think-summary::before { content: "▾ "; }
.cv-speech[data-status="speaking"] .cv-think[open] .cv-think-summary { color: var(--cv-brass); }
.cv-think-text {
  margin: 6px 0 2px;
  max-height: 11em;
  overflow-y: auto;
  font: 13px/1.5 var(--cv-mono);
  color: var(--cv-faint);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.cv-take { flex-basis: 100%; color: var(--cv-dim); }
.cv-take summary { cursor: pointer; }
.cv-take p { margin: 4px 0 0; padding-left: 10px; border-left: 2px solid var(--cv-line-strong); font: italic 13.5px/1.45 var(--cv-serif); color: var(--cv-faint); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--cv-err) 55%, transparent); }
.cv-scene-end .cv-chair-tag { font-size: 13px; }
.cv-scene-end .cv-chair-text { font-style: normal; color: var(--cv-dim); font-size: 1rem; }

.cv-loading { display: grid; gap: 10px; padding: 18px 20px; border: 1px dashed var(--cv-line-strong); border-radius: 10px; max-width: 680px; }
.cv-loading-title { margin: 0; font: 400 italic 1.2rem/1.3 var(--cv-serif); }
.cv-loading-text { margin: 0; color: var(--cv-dim); overflow-wrap: anywhere; }
.cv-loading .lab-meter > i { background: var(--cv-chair); }
.cv-load-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.cv-load-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; font-size: 14px; color: var(--cv-dim); }
.cv-load-who b { color: var(--cv-ink); font-weight: 600; }
.cv-load-what { font-variant-numeric: tabular-nums; }
.cv-load-row[data-phase="download"] .cv-load-what,
.cv-load-row[data-phase="gpu"] .cv-load-what { color: var(--cv-chair); }
.cv-load-row[data-phase="ready"] .cv-load-what::before { content: "✓ "; color: var(--cv-chair); }

/* During a sitting the masthead steps back so the floor gets the screen. */
body.cv-sitting .cv-dek { display: none; }
body.cv-sitting .cv-title { font-size: clamp(1.8rem, 4vw, 2.4rem); }

.cv-replay-note { margin: 0; font-size: 14px; color: var(--cv-dim); }

/* ── the division ─────────────────────────────────────────────────────── */
.cv-division { padding: 22px 24px; display: grid; gap: 14px; }
.cv-division-q { margin: 0; font: 400 1.15rem/1.4 var(--cv-serif); color: var(--cv-dim); text-wrap: balance; }
.cv-ballots { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr); gap: 12px; align-items: start; }
.cv-ballot {
  border: 1px solid var(--cv-line);
  border-radius: 10px;
  padding: 14px 16px;
  display: grid;
  gap: 6px;
  align-content: start;
  background: var(--cv-bg);
  min-width: 0;
}
.cv-ballot-who { margin: 0; display: flex; align-items: center; gap: 8px; font: 600 13.5px/1.2 var(--cv-sans); color: var(--cv-dim); }
.cv-ballot-state { margin: 0; font: 400 1.35rem/1.2 var(--cv-serif); color: var(--cv-ink); }
.cv-ballot-reason { margin: 0; font: 400 italic 14.5px/1.45 var(--cv-serif); color: var(--cv-dim); }
.cv-ballot-chair { background: var(--cv-chair-soft); border-color: color-mix(in srgb, var(--cv-chair) 45%, transparent); gap: 10px; }
.cv-ballot-chair .cv-ballot-who { color: var(--cv-chair); }

.cv-choice { display: flex; flex-wrap: wrap; gap: 8px; }
.cv-choice-btn {
  flex: 1 1 auto;
  min-height: 42px;
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid var(--cv-line-strong);
  background: var(--cv-panel);
  color: var(--cv-ink);
  font: 600 15px/1.2 var(--cv-sans);
  cursor: pointer;
}
.cv-choice-btn:hover:not(:disabled) { border-color: var(--cv-chair); }
.cv-choice-btn[aria-checked="true"] { background: var(--cv-chair); border-color: var(--cv-chair); color: var(--cv-panel); }
.cv-choice-btn:disabled { cursor: default; }
.cv-choice-btn:disabled:not([aria-checked="true"]) { opacity: 0.5; }

.cv-result { border-top: 1px solid var(--cv-line); padding-top: 16px; display: grid; gap: 6px; }
.cv-result-outcome { margin: 0; font: 700 clamp(1.6rem, 3.6vw, 2.2rem)/1.15 var(--cv-serif); text-wrap: balance; }
.cv-result-detail { margin: 0; font-size: 16px; color: var(--cv-dim); max-width: 64ch; }
.cv-result-lean { margin: 0; font: 400 italic 15px/1.45 var(--cv-serif); color: var(--cv-dim); }
.cv-result-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }

/* ── the record ───────────────────────────────────────────────────────── */
.cv-record { padding: 20px 24px; display: grid; gap: 10px; }
.cv-record-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cv-record-list { list-style: none; margin: 0; padding: 0; display: grid; }
.cv-record-list li + li { border-top: 1px solid var(--cv-line); }
.cv-record-item {
  width: 100%;
  text-align: left;
  display: grid;
  gap: 4px;
  padding: 12px 4px;
  border: 0;
  background: none;
  color: var(--cv-ink);
  cursor: pointer;
}
.cv-record-item:hover .cv-record-motion { color: var(--cv-chair); }
.cv-record-motion { font: 400 1.05rem/1.35 var(--cv-serif); }
.cv-record-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; color: var(--cv-faint); }
.cv-kind { font: 500 11px/1 var(--cv-mono); letter-spacing: 0.05em; text-transform: uppercase; padding: 4px 6px 3px; border-radius: 4px; background: var(--cv-panel-2); color: var(--cv-dim); }
.cv-kind[data-kind="tie-break"] { background: var(--cv-chair-soft); color: var(--cv-chair); }
.cv-kind[data-kind="overruled"] { background: var(--cv-a-soft); color: var(--cv-a); }

.cv-foot { font-size: 13px; color: var(--cv-faint); max-width: 80ch; }
.cv-foot p { margin: 0; }
.cv-foot a { color: var(--cv-dim); }

/* ── the chair's console ──────────────────────────────────────────────── */
.cv-console {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 50;
  background: color-mix(in srgb, var(--cv-panel) 92%, transparent);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--cv-line-strong);
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.08);
}
.cv-console-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding-inline: 20px;
  padding-block: 12px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.cv-status { margin: 0; flex: 1 1 260px; font-size: 14px; color: var(--cv-dim); min-width: 0; }
.cv-console-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cv-order-btn { border-color: var(--cv-err); color: var(--cv-err); }
.cv-order-btn:hover { border-color: var(--cv-err); background: color-mix(in srgb, var(--cv-err) 10%, transparent); }
.cv-ask { flex: 1 1 100%; display: flex; gap: 8px; align-items: center; }
.cv-ask .cv-input { min-height: 36px; flex: 1 1 auto; font-size: 14px; }

.cv-page .lab-btn { font-family: var(--cv-sans); }
.cv-page .lab-btn-primary { color: #0b140f; }
.cv-page .lab-btn:focus-visible,
.cv-page .cv-seg-btn:focus-visible,
.cv-page .cv-choice-btn:focus-visible,
.cv-page .cv-example:focus-visible,
.cv-page .cv-record-item:focus-visible { outline: 2px solid var(--cv-chair); outline-offset: 2px; }

@keyframes cv-breathe { 50% { transform: scale(1.35); opacity: 0.65; } }
@keyframes cv-blink { to { visibility: hidden; } }

/* ── motion ──────────────────────────────────────────────────────────── */

/* Segmented controls: a thumb (spring-driven by Motion) shows what is selected. */
.cv-seg.has-thumb { position: relative; }
.cv-seg-thumb {
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 999px;
  background: var(--cv-panel);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.14), inset 0 0 0 1px var(--cv-line-strong);
  pointer-events: none;
  z-index: 0;
  opacity: 0;
}
.cv-seg.has-thumb .cv-seg-btn { position: relative; z-index: 1; }
.cv-seg.has-thumb .cv-seg-btn[aria-checked="true"] { background: transparent; box-shadow: none; }

/* Presses answer instantly; hover lift only where there is a real pointer. */
.cv-page .lab-btn, .cv-page .cv-seg-btn, .cv-page .cv-choice-btn, .cv-page .cv-example, .cv-page .lab-chip {
  transition: transform 120ms var(--ease-out), background-color 160ms var(--ease-out), border-color 160ms var(--ease-out), color 160ms var(--ease-out), box-shadow 160ms var(--ease-out);
}
.cv-page .lab-btn:hover { transform: none; }
.cv-page .lab-btn:active, .cv-page .cv-seg-btn:active, .cv-page .cv-choice-btn:active, .cv-page .lab-chip:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) {
  .cv-page .lab-btn:hover:not(:disabled) { transform: translateY(-1px); }
}

/* A speech arrives from its own seat's side. */
.cv-speech {
  transition: opacity 240ms var(--ease-out), transform 240ms var(--ease-out), border-color 200ms var(--ease-out), box-shadow 200ms var(--ease-out);
}
.cv-speech.cv-seat-a { transform-origin: left top; }
.cv-speech.cv-seat-b { transform-origin: right top; }
@starting-style {
  .cv-speech { opacity: 0; transform: translateY(8px) scale(0.985); }
}
/* Whoever has the floor holds it visibly. */
.cv-speech.cv-seat-a[data-status="speaking"] { box-shadow: 0 0 0 1px color-mix(in srgb, var(--cv-a) 55%, transparent), var(--cv-shadow); }
.cv-speech.cv-seat-b[data-status="speaking"] { box-shadow: 0 0 0 1px color-mix(in srgb, var(--cv-b) 55%, transparent), var(--cv-shadow); }

/* Streaming ink: each new batch of words fades in; no per-character stagger, no travel. */
.cv-ink { animation: cv-ink 160ms var(--ease-out) both; }
@keyframes cv-ink { from { opacity: 0; filter: blur(1.5px); } }
/* The caret marks live generation: steady brass, present only while a model writes. */
.cv-caret { animation: none; background: var(--cv-brass); opacity: 0.85; width: 0.42em; }

/* The chair's line and the scene's end settle in. */
.cv-chair-line { transition: opacity 260ms var(--ease-out), transform 260ms var(--ease-out); }
@starting-style { .cv-chair-line { opacity: 0; transform: translateY(-4px); } }

/* "Latest ↓": a way back to the newest words after scrolling up to reread. */
.cv-latest {
  position: fixed;
  left: 50%;
  bottom: 92px;
  z-index: 55;
  transform: translateX(-50%);
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid var(--cv-line-strong);
  background: var(--cv-panel);
  color: var(--cv-ink);
  font: 600 13px/1 var(--cv-sans);
  box-shadow: var(--cv-shadow);
  cursor: pointer;
  transition: opacity 180ms var(--ease-out), transform 180ms var(--ease-out);
}
@starting-style { .cv-latest { opacity: 0; transform: translate(-50%, 6px); } }

/* View Transitions: the motion on the order paper becomes the summary's motion. */
.cv-motion, .cv-summary-motion { view-transition-name: cv-motion-text; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 220ms; animation-timing-function: var(--ease-out); }
::view-transition-group(cv-motion-text) { animation-duration: 360ms; animation-timing-function: var(--ease-in-out); }

/* Ballots: two-faced cards that flip open. */
/* Seat ballots only: the chair's panel shares .cv-ballot and keeps its own frame. */
.cv-ballot:not(.cv-ballot-chair) { display: block; perspective: 900px; border: 0; background: transparent; padding: 0; }
.cv-ballot-card {
  display: grid;
  transform-style: preserve-3d;
  transition: transform 640ms cubic-bezier(0.34, 1.26, 0.64, 1);
}
.cv-ballot-face {
  grid-area: 1 / 1;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border: 1px solid var(--cv-line);
  border-radius: 10px;
  padding: 14px 16px;
  display: grid;
  gap: 6px;
  align-content: start;
  background: var(--cv-bg);
  min-width: 0;
}
.cv-face-open { transform: rotateY(180deg); background: var(--cv-panel); border-color: var(--cv-line-strong); }
.cv-ballot.is-open .cv-ballot-card { transform: rotateY(180deg); }
.cv-face-sealed .cv-ballot-state::after {
  content: "";
  display: inline-block;
  width: 0.7em;
  height: 0.7em;
  margin-left: 0.4em;
  border-radius: 50%;
  vertical-align: 0.05em;
  background: radial-gradient(circle at 35% 35%, color-mix(in srgb, var(--cv-err) 70%, white), var(--cv-err));
}

/* Hold to cast: a brass fill sweeps the button while held; letting go snaps it back. */
.cv-hold { position: relative; overflow: hidden; touch-action: none; }
.cv-hold-fill {
  position: absolute;
  inset: 0;
  background: var(--cv-brass);
  clip-path: inset(0 100% 0 0);
  transition: clip-path 200ms var(--ease-out);
  pointer-events: none;
}
.cv-hold-label { position: relative; }
.cv-hold.is-holding .cv-hold-fill { clip-path: inset(0 0 0 0); transition: clip-path var(--hold-ms, 1100ms) linear; }
.cv-hold.is-cast .cv-hold-fill { clip-path: inset(0 0 0 0); transition: none; }

/* The ruling's stamp: one inked word, set down once. */
.cv-result { position: relative; }
.cv-stamp {
  position: absolute;
  top: 10px;
  right: 6px;
  margin: 0;
  padding: 4px 12px 3px;
  border: 3px double var(--cv-err);
  border-radius: 6px;
  color: var(--cv-err);
  font: 700 1.05rem/1.1 var(--cv-mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transform: rotate(-7deg);
  opacity: 0;
  mix-blend-mode: multiply;
  pointer-events: none;
}
body.cv-page.dark-mode .cv-stamp { mix-blend-mode: screen; }
.cv-stamp.is-down { opacity: 0.88; }
@media (max-width: 760px) { .cv-stamp { position: static; justify-self: start; margin-bottom: 4px; } }

@media (prefers-reduced-motion: reduce) {
  .cv-ballot-card, .cv-speech, .cv-chair-line, .cv-latest, .cv-seg-thumb { transition: none !important; }
  .cv-ink { animation: none; }
  .cv-ballot.is-open .cv-ballot-card { transform: none; }
  .cv-ballot.is-open .cv-face-sealed { visibility: hidden; }
  .cv-ballot.is-open .cv-face-open { transform: none; }
  .cv-face-open { visibility: hidden; }
  .cv-ballot.is-open .cv-face-open { visibility: visible; }
}

/* ── narrow screens ───────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .cv { padding-block: 76px 200px; gap: 22px; }
  .cv-order { padding: 18px 16px; }
  .cv-seats { grid-template-columns: minmax(0, 1fr); }
  .cv-versus { justify-self: center; }
  .cv-pair { grid-template-columns: minmax(0, 1fr); }
  .cv-turn { max-width: 100%; }
  .cv-ballots { grid-template-columns: minmax(0, 1fr); }
  .cv-division, .cv-record { padding: 18px 16px; }
  .cv-seg-sub { display: none; }
  /* The console took a quarter of a phone screen (status, buttons, input, select, button
     on separate rows): one-line status, and the question on a single row. */
  .cv-console-inner { padding-block: 8px; gap: 6px 8px; }
  .cv-status { flex-basis: 100%; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .cv-ask { flex-wrap: nowrap; gap: 6px; }
  .cv-ask .cv-input { min-width: 0; }
  .cv-ask .cv-select-sm { max-width: 32%; }
}

@media (prefers-reduced-motion: reduce) {
  .cv-speech[data-status="speaking"] .cv-dot, .cv-caret { animation: none; }
}

/* --- The road not taken -------------------------------------------------
   Every token a performer spoke was picked from a distribution. This draws
   that distribution: a spine of what was said, and branches only where the
   model genuinely hesitated. Nothing here is drawn without a real logprob
   behind it (scripts/casting-vote/cv-branches.js).                        */
.cv-branches { margin: 10px 0 2px; }
.cv-branches[hidden] { display: none; }
.cv-branches-summary {
  cursor: pointer;
  font-size: 12px;
  color: var(--cv-faint);
  letter-spacing: .02em;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
}
.cv-branches-summary::-webkit-details-marker { display: none; }
.cv-branches-summary::before {
  content: "";
  width: 6px; height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  transition: transform .18s ease;
}
.cv-branches[open] .cv-branches-summary::before { transform: rotate(45deg); }
.cv-branches-summary:hover { color: var(--cv-ink); }
.cv-branches-note { margin: 6px 0 2px; font-size: 12px; color: var(--cv-faint); }
.cv-branches, .cv-branches-canvas, .cv-walk {
  /* min-width:0 is load-bearing: without it the grid/flex item sizes to the
     2148px canvas instead of scrolling it, and the whole speech card grows
     wider than the viewport. */
  min-width: 0;
  max-width: 100%;
}
.cv-branches-canvas { width: 100%; overflow-x: auto; overflow-y: hidden; }
.cv-walk-body, .cv-walk-head { overflow-wrap: anywhere; }
.cvb-canvas { display: block; overflow: visible; max-width: none; }

.cvb-edge { fill: none; stroke: var(--cv-line-strong); }
.cvb-edge-spine { stroke-width: 1.6; }
.cvb-edge-alt { stroke-width: 1; stroke-dasharray: 3 3; }

.cvb-dot { fill: var(--cv-line-strong); }
.cvb-node-spine .cvb-dot { fill: var(--cv-ink); }
.cvb-node-alt .cvb-dot { fill: none; stroke: var(--cv-b); stroke-width: 1.4; }
.cv-seat-a .cvb-node-alt .cvb-dot { stroke: var(--cv-a); }

.cvb-label {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10.5px;
  fill: var(--cv-faint);
  pointer-events: none;
}
.cvb-node-spine .cvb-label { fill: var(--cv-ink); }

.cvb-node.is-walkable { cursor: pointer; }
.cvb-node.is-walkable:hover .cvb-dot,
.cvb-node.is-walkable:focus-visible .cvb-dot { fill: var(--cv-b); }
.cv-seat-a .cvb-node.is-walkable:hover .cvb-dot,
.cv-seat-a .cvb-node.is-walkable:focus-visible .cvb-dot { fill: var(--cv-a); }
.cvb-node.is-walkable:hover .cvb-label,
.cvb-node.is-walkable:focus-visible .cvb-label { fill: var(--cv-ink); }
.cvb-node.is-walkable:focus-visible { outline: none; }
.cvb-node.is-walkable:focus-visible .cvb-dot { stroke-width: 2.4; }

@media (prefers-reduced-motion: reduce) {
  .cv-branches-summary::before { transition: none; }
}

/* The counterfactual. Marked as NOT part of the sitting, because it isn't:
   the same prompt with one word changed, continued from there.              */
.cv-walk {
  margin-top: 10px;
  padding: 10px 12px;
  border-left: 2px solid var(--cv-line-strong);
  background: color-mix(in srgb, var(--cv-line) 16%, transparent);
  border-radius: 0 6px 6px 0;
}
.cv-walk-head { margin: 0 0 6px; font-size: 12px; color: var(--cv-faint); }
.cv-walk-body { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--cv-dim); }
.cv-walk-pending { color: var(--cv-faint); font-style: italic; }
.cv-walk-kept { color: var(--cv-faint); }
.cv-walk-forced {
  background: color-mix(in srgb, var(--cv-b) 26%, transparent);
  color: inherit;
  padding: 0 2px;
  border-radius: 3px;
}
.cv-seat-a .cv-walk-forced { background: color-mix(in srgb, var(--cv-a) 26%, transparent); }
.cv-walk-foot { margin: 8px 0 0; font-size: 11.5px; color: var(--cv-faint); }
.cvb-node-gap .cvb-label { fill: var(--cv-line-strong); letter-spacing: .06em; }
.cvb-edge-gap { stroke: var(--cv-line-strong); stroke-width: 1; stroke-dasharray: 2 4; fill: none; }