/* Investigative dossier theme — DSA LA */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  --paper: #f1e9d7;
  --paper-2: #ebe2cc;
  --paper-3: #e3d8be;
  --ink: #1a1612;
  --ink-2: #3a3631;
  --ink-3: #6a6157;
  --rule: #c8bda1;
  --red: #8c1c1c;
  --red-deep: #6b1414;
  --red-pale: #d9a8a8;
  --ochre: #a6781f;
  --stamp: #c43a1f;
  --stamp-blue: #1f3d6b;
  /* Whole report uses Manrope (headlines + body); monospace labels unchanged. */
  --serif: "Manrope", system-ui, sans-serif;
  --sans: "Manrope", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "Menlo", monospace;
  /* polish tokens — consolidated repeated values */
  --gold: #e2b330;
  --rose: #d97a7a;
  --tag-labor: #5d4d2c;
  --tag-labor-bd: #b89a5b;
  --tag-campus: #5b3478;
  --tag-campus-bd: #9a72ba;
  --shadow-hard: 5px 5px 0 var(--ink);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 130ms;
  --t-base: 240ms;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.55; }
body {
  background-image:
    radial-gradient(circle at 20% 30%, rgba(166,120,31,.04) 0, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(140,28,28,.03) 0, transparent 50%),
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(26,22,18,.012) 3px 4px);
}

::selection { background: var(--ink); color: var(--paper); }

/* === Type === */
.serif { font-family: var(--serif); }
.mono { font-family: var(--mono); }
.eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); }
.kicker { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.h-display { font-family: var(--serif); font-weight: 600; line-height: 0.98; letter-spacing: -0.01em; }
.h1 { font-family: var(--serif); font-weight: 600; font-size: 56px; line-height: 1.02; letter-spacing: -0.015em; }
.h2 { font-family: var(--serif); font-weight: 600; font-size: 38px; line-height: 1.08; letter-spacing: -0.012em; }
.h3 { font-family: var(--serif); font-weight: 600; font-size: 24px; line-height: 1.15; }
.lede { font-family: var(--serif); font-size: 22px; line-height: 1.45; color: var(--ink-2); font-weight: 400; }
.body { font-family: var(--serif); font-size: 18px; line-height: 1.55; color: var(--ink-2); font-weight: 400; }
/* Honor explicit blank-line breaks (\n\n) inserted into long prose blocks for readability */
.body, .npc-tab-panel p, .analysis-block .text, .om-val, .mom-deck, .mom p, .zn-lead, .ndsa-modes-note, .section-sub { white-space: pre-line; }
.body-sm { font-family: var(--sans); font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }
.caption { font-family: var(--mono); font-size: 11px; letter-spacing: .04em; color: var(--ink-3); text-transform: uppercase; }
.quote { font-family: var(--serif); font-style: italic; font-size: 19px; line-height: 1.45; color: var(--ink); }

a { color: var(--red); }

/* === Layout === */
.page { max-width: 1240px; margin: 0 auto; padding: 0 48px; }
.section { padding: 96px 0; border-top: 1px solid var(--rule); }
.section:first-of-type { border-top: none; }
.section-head { display: grid; grid-template-columns: 130px 1fr; gap: 32px; align-items: baseline; margin-bottom: 56px; }
.section-num { font-family: var(--mono); font-size: 12px; letter-spacing: .14em; color: var(--red); text-transform: uppercase; padding-top: 8px; }
.section-num::before { content: "§ "; }
.section-title { font-family: var(--serif); font-weight: 600; font-size: 44px; line-height: 1.02; letter-spacing: -0.014em; }
.section-sub { font-family: var(--serif); font-size: 19px; color: var(--ink-2); margin-top: 14px; max-width: 720px; line-height: 1.45; font-style: italic; }
.divider-thin { border-top: 1px solid var(--rule); margin: 32px 0; }
.divider-thick { border-top: 3px solid var(--ink); margin: 24px 0; }
.divider-double { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); height: 5px; margin: 24px 0; }

/* === Masthead === */
.masthead {
  padding: 36px 0 0;
  border-bottom: 3px double var(--ink);
}
.masthead-top {
  display: flex; justify-content: space-between; align-items: flex-end;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ink);
}
.masthead-mark { font-family: var(--serif); font-weight: 700; font-size: 18px; letter-spacing: -0.005em; }
.masthead-meta { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); display: flex; gap: 28px; }
.masthead-meta span { display: inline-block; }
.masthead-title {
  font-family: var(--serif); font-weight: 600;
  font-size: clamp(64px, 9vw, 132px); line-height: 0.92; letter-spacing: -0.022em;
  padding: 26px 0 18px;
}
.masthead-sub {
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: 26px; line-height: 1.3; color: var(--ink-2);
  max-width: 920px; padding-bottom: 36px;
}
.masthead-bottom {
  display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 0;
  border-top: 1px solid var(--ink);
  padding: 18px 0 14px;
}
.mb-cell { border-right: 1px solid var(--rule); padding: 0 22px; }
.mb-cell:first-child { padding-left: 0; }
.mb-cell:last-child { border-right: none; padding-right: 0; }
.mb-label { font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; color: var(--ink-3); text-transform: uppercase; }
.mb-value { font-family: var(--serif); font-size: 22px; line-height: 1.1; margin-top: 4px; }

/* === Stamp === */
.stamp {
  display: inline-block;
  font-family: var(--mono); font-weight: 600; font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--stamp);
  border: 2px solid var(--stamp); padding: 4px 9px;
  transform: rotate(-1.5deg);
  background: rgba(196,58,31,.04);
}
.stamp-blue { color: var(--stamp-blue); border-color: var(--stamp-blue); background: rgba(31,61,107,.04); }
.stamp-ink { color: var(--ink); border-color: var(--ink); background: rgba(26,22,18,.04); }

/* === Findings — expandable cards === */
.findings-bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; margin-bottom: 16px;
}
.findings-count {
  font-family: var(--mono); font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-3);
}
.findings-toggle-all {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--paper); background: var(--ink);
  border: 1px solid var(--ink); padding: 8px 14px; cursor: pointer;
  transition: background .12s, border-color .12s;
}
.findings-toggle-all:hover { background: var(--red); border-color: var(--red); }

.findings { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.finding {
  border: 1px solid var(--ink); background: var(--paper);
  transition: box-shadow .12s ease, transform .12s ease;
}
.finding.open { box-shadow: var(--shadow-hard); }
.finding-head {
  display: grid; grid-template-columns: auto 1fr auto;
  column-gap: 15px; align-items: center;
  width: 100%; text-align: left; font: inherit;
  background: none; border: none; cursor: pointer;
  padding: 17px 19px; min-height: 100px;
  transition: background .12s ease;
}
.finding:hover .finding-head { background: var(--paper-2); }
.f-n {
  font-family: var(--serif); font-size: 31px; font-weight: 600;
  color: var(--red); line-height: 1;
}
.f-head {
  font-family: var(--serif); font-size: 17.5px; font-weight: 600;
  line-height: 1.24; letter-spacing: -0.008em; color: var(--ink);
}
.f-toggle {
  width: 26px; height: 26px; flex: none;
  border: 1px solid var(--ink);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 19px; line-height: 1; color: var(--ink);
  transition: background .12s, color .12s, border-color .12s;
}
.finding:hover .f-toggle,
.finding.open .f-toggle {
  background: var(--red); color: var(--paper); border-color: var(--red);
}
.f-panel { animation: fBodyIn .16s ease; }
@keyframes fBodyIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}
.f-body {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.58;
  color: var(--ink-2);
  padding: 14px 19px 16px; border-top: 1px solid var(--rule);
}
.f-bullets {
  margin: 0; padding: 14px 19px 16px; list-style: none; border-top: 1px solid var(--rule);
}
.f-bullets li {
  font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink);
  padding: 9px 0 9px 22px; position: relative; border-top: 1px dashed var(--rule);
}
.f-bullets li:first-child { border-top: none; }
.f-bullets li::before {
  content: "▸"; position: absolute; left: 2px; top: 9px; color: var(--red); font-size: 14px;
}

/* === In-text clickable insight terms === */
.insight-term {
  font: inherit; background: none; border: none; padding: 0 1px;
  cursor: pointer; color: inherit;
  border-bottom: 1.5px dotted currentColor;
  transition: background .1s;
}
.insight-term:hover { background: var(--paper-3); }
.it-person { color: var(--red); font-weight: 600; }
.it-org { color: var(--ochre); font-weight: 600; }
.it-term {
  color: var(--ink); border-bottom-style: dashed;
  border-bottom-color: var(--ink-3);
}

/* === Finding tools (Connects to / Evidence) === */
.f-tools {
  display: flex; gap: 8px; flex-wrap: wrap;
  padding: 0 19px 14px;
}
.f-tool {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink);
  background: var(--paper-2); border: 1px solid var(--ink);
  padding: 8px 11px; cursor: pointer;
  transition: background .12s, color .12s;
}
.f-tool:hover { background: var(--paper-3); }
.f-tool.active { background: var(--ink); color: var(--paper); }
.f-tool .ft-ico { font-size: 11px; }
.f-tool .ft-n {
  background: var(--red); color: var(--paper);
  padding: 1px 6px; font-size: 9.5px;
}
.f-tool.active .ft-n { background: var(--red); }

/* === Insight tray === */
.f-tray {
  margin: 0 19px 18px;
  border: 1px solid var(--ink); background: var(--paper-3);
  animation: fBodyIn .15s ease;
}
.f-tray-empty {
  margin: 0 19px 18px;
  border: 1px dashed var(--rule); background: transparent;
  padding: 13px 15px;
  font-family: var(--sans); font-size: 12px; line-height: 1.6;
  color: var(--ink-3);
}
.legend-swatch {
  display: inline-block; width: 9px; height: 9px; border-radius: 50%;
  margin: 0 1px -1px;
}
.legend-swatch.s-person { background: var(--red); }
.legend-swatch.s-org { background: var(--ochre); }
.legend-swatch.s-term { background: var(--ink-3); }

.f-tray-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 13px; background: var(--ink);
}
.f-tray-label {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--paper);
}
.f-tray-close {
  background: none; border: none; color: var(--paper);
  cursor: pointer; font-size: 13px; line-height: 1; padding: 2px 4px;
}
.f-tray-close:hover { color: var(--red-pale); }
.ins-block { padding: 14px 15px; }
.ins-name {
  font-family: var(--serif); font-weight: 600; font-size: 19px;
  line-height: 1.15; color: var(--ink);
}
.ins-role {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--red); margin-top: 4px;
}
.ins-line {
  font-family: var(--serif); font-size: 13.5px; line-height: 1.45;
  color: var(--ink-2); margin-top: 8px;
}
.ins-line strong {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-3);
  display: block; margin-bottom: 1px; font-weight: 400;
}
.ins-sum {
  font-family: var(--serif); font-size: 14px; line-height: 1.52;
  color: var(--ink-2); margin: 10px 0 0;
}
.ins-hint {
  font-family: var(--sans); font-size: 12px; line-height: 1.5;
  color: var(--ink-3); margin: 0 0 10px;
}
.ins-jump {
  margin-top: 12px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--paper); background: var(--red);
  border: none; padding: 8px 12px; cursor: pointer;
  transition: background .12s;
}
.ins-jump:hover { background: var(--red-deep); }
.ins-link-grid { display: grid; gap: 6px; }
.ins-section-link {
  display: grid; grid-template-columns: auto 1fr auto; gap: 10px;
  align-items: center;
  background: var(--paper); border: 1px solid var(--ink);
  padding: 9px 12px; cursor: pointer; text-align: left;
  transition: background .12s, transform .1s;
}
.ins-section-link:hover { background: var(--paper-2); transform: translateX(3px); }
.isl-num {
  font-family: var(--mono); font-size: 10px; letter-spacing: .08em;
  color: var(--red);
}
.isl-label {
  font-family: var(--serif); font-weight: 600; font-size: 15px; color: var(--ink);
}
.isl-arrow { font-family: var(--mono); color: var(--red); }
.f-tray .src-bar { margin-top: 4px; }

/* === Politician card === */
.slate-toolbar { display: flex; gap: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); margin-bottom: 24px; flex-wrap: wrap; }
.slate-toolbar button { background: none; border: none; padding: 10px 16px; font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); cursor: pointer; border-right: 1px solid var(--rule); }
.slate-toolbar button:last-child { border-right: none; }
.slate-toolbar button.active { color: var(--paper); background: var(--ink); }
.slate-toolbar button:hover:not(.active) { color: var(--ink); background: var(--paper-2); }

.dossier { background: var(--paper-2); border: 1px solid var(--rule); margin-bottom: 14px; }
.dossier-head { display: grid; grid-template-columns: 88px 1fr auto; gap: 22px; padding: 22px 24px; cursor: pointer; align-items: center; }
.dossier-head:hover { background: var(--paper-3); }
.dossier-photo {
  width: 88px; height: 110px;
  background: var(--ink); color: var(--paper);
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 8px 10px;
  font-family: var(--mono);
  position: relative;
}
.dossier-photo::after {
  content: ""; position: absolute; inset: 4px; border: 1px dashed rgba(241,233,215,.25); pointer-events: none;
}
.dossier-photo .ini { font-family: var(--serif); font-size: 32px; font-weight: 600; line-height: 1; align-self: center; margin: auto; }
.dossier-photo .pid { font-size: 9px; letter-spacing: .14em; opacity: .65; }
.dossier-name { font-family: var(--serif); font-size: 27px; font-weight: 600; line-height: 1.05; letter-spacing: -0.008em; }
.dossier-role { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-top: 4px; }
.dossier-bullet { font-family: var(--serif); font-size: 15.5px; color: var(--ink-2); margin-top: 8px; line-height: 1.4; }
.dossier-status {
  text-align: right; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink); padding: 4px 10px; border: 1px solid var(--ink); background: var(--paper);
}
.dossier-toggle { font-family: var(--serif); font-size: 22px; color: var(--red); margin-left: 12px; }

.dossier-body { padding: 0 24px 28px; border-top: 1px solid var(--rule); }
.dossier-body[hidden] { display: none; }
.dossier-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; margin-top: 22px; }
.field-label { font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 6px; }
.field-value { font-family: var(--serif); font-size: 16px; color: var(--ink); line-height: 1.5; }
.stance-row { padding: 12px 0; border-top: 1px dashed var(--rule); }
.stance-row:first-child { border-top: none; padding-top: 0; }
.stance-key { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); margin-bottom: 4px; }
.stance-val { font-family: var(--serif); font-size: 16px; color: var(--ink); line-height: 1.48; }
.tag-list { display: flex; flex-wrap: wrap; gap: 6px; }
.tag {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase;
  padding: 3px 8px; background: var(--paper); border: 1px solid var(--ink); color: var(--ink);
}
.tag.red { color: var(--red); border-color: var(--red); }
.flag-list { margin-top: 12px; }
.flag {
  font-family: var(--sans); font-size: 13.5px; color: var(--ink-2);
  padding-left: 16px; position: relative; margin-bottom: 8px;
}
.flag::before {
  content: "▸"; position: absolute; left: 0; color: var(--red); font-size: 14px;
}
.flag.neutral::before { content: "•"; }

/* === Candidate extras: personal · social · channels === */
.dossier-extras {
  margin-top: 26px; padding-top: 22px; border-top: 2px solid var(--ink);
  display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start;
}
.dossier-extras .dx-block:first-child { grid-column: 1; }
.dx-social { margin-top: 8px; }
.dx-social-item {
  font-family: var(--serif); font-size: 14px; line-height: 1.45; color: var(--ink);
  padding: 10px 0; border-top: 1px dashed var(--rule);
}
.dx-social-item:first-child { border-top: none; padding-top: 2px; }
.dx-social-link {
  display: inline-block; margin-left: 6px; font-family: var(--mono); font-size: 10px;
  letter-spacing: .08em; text-transform: uppercase; color: var(--red); text-decoration: none;
  border-bottom: 1px solid var(--red-pale); white-space: nowrap;
}
.dx-social-link:hover { border-bottom-color: var(--red); }
.dx-handles { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.dx-handle {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink);
  text-decoration: none; border: 1px solid var(--rule); padding: 5px 9px; background: var(--paper-2);
}
.dx-handle:hover { border-color: var(--ink); background: var(--paper); }
@media (max-width: 720px) {
  .dossier-extras { grid-template-columns: 1fr; gap: 20px; }
}

/* === Machine flow === */
.machine-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
  border-top: 1px solid var(--ink); border-left: 1px solid var(--ink);
}
.machine-step {
  border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  padding: 26px 24px;
  background: var(--paper);
  position: relative;
}
.machine-step .ms-n {
  font-family: var(--serif); font-size: 80px; font-weight: 700; color: var(--paper-3);
  line-height: 0.8; margin-bottom: -28px;
}
.machine-step h4 {
  font-family: var(--serif); font-weight: 600; font-size: 22px; margin: 0 0 10px;
  letter-spacing: -0.008em;
  position: relative;
}
.machine-step p { font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink-2); margin: 0; }

/* === Coalition matrix === */
.matrix-wrap { overflow-x: auto; }
.matrix {
  border-collapse: collapse; width: 100%;
  font-family: var(--sans); font-size: 13px;
  border: 1px solid var(--ink);
}
.matrix th, .matrix td {
  padding: 10px 8px; border: 1px solid var(--rule);
  vertical-align: middle; text-align: center;
}
.matrix thead th {
  background: var(--ink); color: var(--paper);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
  font-weight: 500; padding: 12px 8px; border-color: var(--ink);
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  min-height: 130px;
  white-space: nowrap;
}
.matrix thead th:first-child {
  writing-mode: horizontal-tb; transform: none; height: auto; text-align: left; padding-left: 16px;
}
.matrix tbody td { background: var(--paper); }
.matrix tbody tr:hover td { background: var(--paper-3); }
.matrix tbody td.row-head { text-align: left; padding: 14px 16px; }
.matrix .campaign-name { font-family: var(--serif); font-weight: 600; font-size: 16px; }
.matrix .campaign-desc { font-family: var(--mono); font-size: 10.5px; color: var(--ink-3); letter-spacing: .08em; text-transform: uppercase; margin-top: 3px; }
.dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; background: var(--ink); }
.dot.red { background: var(--red); }
.dot.ochre { background: var(--ochre); }
.dot-off { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--rule); background: transparent; opacity: .5; }

/* === Network web === */
.web-stage { position: relative; width: 100%; aspect-ratio: 16/10; background: var(--paper); border: 1px solid var(--ink); overflow: hidden; }
.web-svg { width: 100%; height: 100%; display: block; }
.web-svg .node-circle { fill: var(--paper-2); stroke: var(--ink); stroke-width: 1.5; cursor: pointer; transition: fill 200ms; }
.web-svg .node-circle.politician { fill: var(--red); stroke: var(--red-deep); }
.web-svg .node-circle.org { fill: var(--paper); }
.web-svg .node-circle:hover, .web-svg .node-circle.active { fill: var(--ink); stroke: var(--ink); }
.web-svg .node-label { font-family: var(--mono); font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; fill: var(--ink); pointer-events: none; text-anchor: middle; }
.web-svg .node-label.on-dark { fill: var(--paper); }
.web-svg .edge { stroke: var(--ink-3); stroke-width: 0.6; opacity: 0.18; fill: none; }
.web-svg .edge.highlight { stroke: var(--red); stroke-width: 1.6; opacity: 1; }

/* === Map === */
.map-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
.map-stage { position: relative; background: var(--paper-2); border: 1px solid var(--ink); }
.map-svg { width: 100%; aspect-ratio: 691.8 / 1020; height: auto; display: block; }
.cd-shape { stroke: var(--ink); stroke-width: 1.3; }
.cd-shape.context { fill: var(--paper-3); }
.cd-shape.stronghold { cursor: pointer; transition: fill 200ms var(--ease-out); }
.cd-num-label {
  font-family: var(--mono); font-size: 14px; fill: var(--ink-3);
  text-anchor: middle; dominant-baseline: middle; pointer-events: none;
}
.cd-num-label.on { fill: var(--paper); font-weight: 600; font-size: 17px; }
.map-marker { fill: var(--ink); stroke: var(--paper); stroke-width: 2.4; cursor: pointer; transition: fill 150ms, r 150ms; }
.map-marker.active { fill: var(--red); }
.map-marker-label {
  font-family: var(--mono); font-size: 15px; letter-spacing: .05em; font-weight: 600;
  fill: var(--ink); text-anchor: middle; pointer-events: none;
}
.map-info { padding: 0 4px; position: sticky; top: 72px; align-self: start; }
.map-info .mi-eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; color: var(--red); text-transform: uppercase; }
.map-info .mi-title { font-family: var(--serif); font-size: 28px; font-weight: 600; margin-top: 4px; line-height: 1.1; }
.map-info .mi-region { font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--ink-2); margin-top: 10px; }
.map-info .mi-who { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink); margin-top: 14px; }
.map-info dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 20px 0 0; font-family: var(--sans); font-size: 14px; }
.map-info dt { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.map-info dd { margin: 0; color: var(--ink); }

/* === Policy consequences === */
.policy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.policy-card { border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 26px 24px; background: var(--paper); }
.policy-card .pc-code { font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em; color: var(--red); }
.policy-card h4 { font-family: var(--serif); font-weight: 600; font-size: 26px; margin: 6px 0 12px; line-height: 1.1; letter-spacing: -0.01em; }
.policy-card .pc-sponsor { font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 14px; }
.policy-card .pc-summary { font-family: var(--serif); font-size: 16px; line-height: 1.5; color: var(--ink-2); }
.policy-card .pc-outcome {
  font-family: var(--serif); font-size: 16px; line-height: 1.5;
  margin-top: 14px; padding: 14px 16px;
  background: rgba(140,28,28,.06); border-left: 3px solid var(--red);
}
.policy-card .pc-outcome::before { content: "OUTCOME"; display: block; font-family: var(--mono); font-size: 10px; letter-spacing: .2em; color: var(--red); margin-bottom: 6px; }
.policy-card .pc-quote { font-family: var(--serif); font-style: italic; font-size: 15.5px; color: var(--ink); margin-top: 14px; line-height: 1.45; padding-left: 14px; border-left: 2px solid var(--ink); }

/* === Timeline === */
.timeline-toolbar { display: flex; gap: 8px; flex-wrap: wrap; padding: 16px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); margin-bottom: 24px; }
.t-pill {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  padding: 5px 12px; background: transparent; border: 1px solid var(--ink); color: var(--ink); cursor: pointer;
}
.t-pill.active { background: var(--ink); color: var(--paper); }
.t-pill.red.active { background: var(--red); border-color: var(--red); }
.timeline-bars { display: grid; grid-template-columns: 80px 1fr; gap: 14px; align-items: center; margin-bottom: 28px; }
.tb-month { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--ink-3); text-align: right; }
.tb-stack { position: relative; height: 26px; background: var(--paper-2); border: 1px solid var(--rule); display: flex; }
.tb-seg { height: 100%; }

.timeline-list { border-top: 1px solid var(--ink); }
.tl-item { display: grid; grid-template-columns: 110px 1fr auto; gap: 22px; padding: 14px 0; border-bottom: 1px solid var(--rule); align-items: baseline; }
.tl-date { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: var(--red); }
.tl-name { font-family: var(--serif); font-size: 17px; color: var(--ink); line-height: 1.35; }
.tl-orgs { font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink-3); text-transform: uppercase; margin-top: 4px; }
.tl-themes { display: flex; gap: 4px; }
.tl-tag { font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; padding: 3px 8px; text-transform: uppercase; border: 1px solid var(--rule); color: var(--ink-3); }
.tl-tag.palestine { color: var(--red); border-color: var(--red); }
.tl-tag.labor { color: var(--tag-labor); border-color: var(--tag-labor-bd); }
.tl-tag.immigration { color: var(--stamp-blue); border-color: var(--stamp-blue); }
.tl-tag.electoral { color: var(--ink); border-color: var(--ink); background: var(--paper-3); }
.tl-tag.housing { color: var(--ink-2); border-color: var(--ink-2); }
.tl-tag.antiwar { color: var(--stamp); border-color: var(--stamp); }
.tl-tag.campus { color: var(--tag-campus); border-color: var(--tag-campus-bd); }

.timeline-more {
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  background: var(--ink); color: var(--paper); border: none; padding: 12px 20px; margin-top: 18px; cursor: pointer;
}
.timeline-meta { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--ink-3); margin-bottom: 16px; }

/* === Org chip === */
.org-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.org-card { padding: 20px 18px; background: var(--paper-2); border: 1px solid var(--rule); position: relative; }
.org-card .role { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.org-card .name { font-family: var(--serif); font-weight: 600; font-size: 22px; margin: 4px 0 2px; line-height: 1.05; }
.org-card .full { font-family: var(--mono); font-size: 10.5px; color: var(--ink-3); letter-spacing: .04em; margin-bottom: 10px; }
.org-card .fn { font-family: var(--serif); font-size: 15px; line-height: 1.45; color: var(--ink-2); }
.org-card.dsa { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.org-card.dsa .role { color: var(--rose); }
.org-card.dsa .full, .org-card.dsa .fn { color: var(--paper-3); }
.org-card.dsa .name { color: var(--paper); }
.org-card.clickable {
  cursor: pointer; text-align: left; width: 100%; font: inherit; color: inherit;
  display: flex; flex-direction: column;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.org-card.clickable:hover, .org-card.clickable:focus-visible {
  transform: translateY(-3px); box-shadow: var(--shadow-hard); outline: none; background: var(--paper);
}
.org-card.clickable.dsa:hover, .org-card.clickable.dsa:focus-visible { background: var(--ink); }
.org-card.clickable.open { box-shadow: var(--shadow-hard); }
.org-card-cue {
  font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red); margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--rule);
}
.org-card.dsa .org-card-cue { color: var(--rose); border-top-color: rgba(241,233,215,.18); }

/* === Comparison table === */
.cmp { border-collapse: collapse; width: 100%; font-family: var(--sans); font-size: 14.5px; }
.cmp th, .cmp td { padding: 14px 14px; text-align: left; border-bottom: 1px solid var(--rule); vertical-align: top; }
.cmp thead th { background: var(--paper-2); font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); font-weight: 500; border-bottom: 2px solid var(--ink); }
.cmp tbody tr:hover td { background: var(--paper-2); }
.cmp .metric { font-family: var(--serif); font-weight: 600; font-size: 16px; color: var(--ink); }
.cmp .la-col { font-family: var(--serif); font-size: 15.5px; color: var(--ink); background: rgba(140,28,28,.05); border-left: 3px solid var(--red); }
.cmp .note { font-family: var(--serif); font-style: italic; color: var(--ink-3); font-size: 14px; }

/* === Footer === */
.footer { padding: 60px 0 80px; border-top: 3px double var(--ink); margin-top: 96px; }

/* === Source link styling === */
.src-list { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-top: 10px; }
.src-link {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink);
  border: 1px solid var(--rule); background: var(--paper);
  padding: 3px 8px; text-decoration: none;
  display: inline-flex; align-items: center; gap: 6px;
  text-transform: none;
}
.src-link:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.src-link::after { content: "↗"; font-size: 11px; opacity: 0.6; }
.src-link.red { color: var(--red); border-color: var(--red); }
.src-link.red:hover { background: var(--red); color: var(--paper); }
.src-bar { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--rule); }
.src-bar .src-eyebrow { font-family: var(--mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 8px; }
.finding .f-body .src-bar { margin-top: 14px; }

/* === Priority campaigns === */
.priority-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.priority-card { padding: 26px 24px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.priority-card .pc-n { font-family: var(--serif); font-size: 64px; line-height: 0.85; color: var(--paper-3); font-weight: 700; margin-bottom: -22px; }
.priority-card h4 { font-family: var(--serif); font-weight: 600; font-size: 26px; margin: 4px 0 4px; letter-spacing: -0.01em; position: relative; }
.priority-card .role { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); margin-bottom: 12px; }
.priority-card .body-p { font-family: var(--serif); font-size: 16px; line-height: 1.5; color: var(--ink-2); }
.priority-card ul { margin: 14px 0 0 0; padding: 0; list-style: none; }
.priority-card li { font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink); padding-left: 18px; position: relative; margin-bottom: 8px; }
.priority-card li::before { content: "▸"; position: absolute; left: 0; color: var(--red); font-size: 13px; top: 1px; }

/* === Chapter receipts === */
.chapter-receipts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); margin-top: 36px; }
.chapter-receipts .stake { background: var(--ink); color: var(--paper); }
.chapter-receipts .stake .lbl { color: rgba(241,233,215,0.55); }
.chapter-receipts .stake .note { color: rgba(241,233,215,0.85); }
.chapter-receipts .stake .big { color: var(--red-pale); }

/* === Endorsement web === */
.endorse-web-wrap { background: var(--paper); border: 1px solid var(--ink); position: relative; }
.endorse-web-stage { background: var(--paper); border-bottom: 1px solid var(--ink); scroll-margin-top: 72px; }
.endorse-web-toolbar {
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
  padding: 12px 18px;
  display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
}
.endorse-leaderboard {
  background: var(--paper-2);
  padding: 22px 22px 22px;
  border-top: 1px solid var(--ink);
}
.endorse-leaderboard .lb-eyebrow {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--red);
  margin-bottom: 6px;
}
.endorse-leaderboard .lb-hint {
  font-family: var(--serif); font-style: italic; font-size: 14.5px; color: var(--ink-2);
  margin-bottom: 14px; max-width: 740px;
}
.endorse-leaderboard .lb-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 28px;
}
.endorse-leaderboard .lb-row {
  display: grid; grid-template-columns: 32px 1fr 32px;
  align-items: center; gap: 10px;
  padding: 8px 10px;
  border-bottom: 1px dashed var(--rule);
  transition: background 120ms;
  cursor: pointer;
}
.endorse-leaderboard .lb-row:hover, .endorse-leaderboard .lb-row.hilit {
  background: var(--ink);
  color: var(--paper);
}
.endorse-leaderboard .lb-row .rank { font-family: var(--mono); font-size: 10.5px; color: var(--ink-3); }
.endorse-leaderboard .lb-row.hilit .rank { color: var(--paper-3); }
.endorse-leaderboard .lb-row .pair-name { font-family: var(--serif); font-size: 15.5px; line-height: 1.3; }
.endorse-leaderboard .lb-row .pair-names { font-family: var(--mono); font-size: 10px; color: var(--ink-3); margin-top: 2px; letter-spacing: .04em; }
.endorse-leaderboard .lb-row.hilit .pair-names { color: var(--paper-3); }
.endorse-leaderboard .lb-row .count { font-family: var(--mono); font-weight: 600; font-size: 16px; color: var(--red); text-align: right; }
.endorse-leaderboard .lb-row.hilit .count { color: var(--red-pale); }
.endorse-leaderboard .lb-clear {
  margin-left: auto; display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 1px solid var(--ink); color: var(--ink);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  padding: 5px 10px; cursor: pointer;
}
.endorse-leaderboard .lb-clear:hover { background: var(--ink); color: var(--paper); }
.endorse-leaderboard .lb-header { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.endorse-web-footer {
  border-top: 1px solid var(--ink); padding: 10px 18px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; color: var(--ink-3);
}

@media (max-width: 720px) {
  .endorse-leaderboard .lb-grid { grid-template-columns: 1fr; }
}
/* === Extended org tiles + modal === */
.org-extended-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 24px; }
.org-extended-tile {
  text-align: left; padding: 14px 14px 12px; cursor: pointer;
  background: var(--paper-2); border: 1px solid var(--rule); color: var(--ink);
  font-family: inherit; display: flex; flex-direction: column; gap: 2px;
  transition: background 150ms, border-color 150ms;
  min-height: 100px;
}
.org-extended-tile:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.org-extended-tile.dsa { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.org-extended-tile.dsa:hover { background: var(--red); border-color: var(--red); }
.org-extended-tile .oxt-role { font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.org-extended-tile.dsa .oxt-role { color: var(--rose); }
.org-extended-tile:hover .oxt-role { color: var(--red-pale); }
.org-extended-tile .oxt-name { font-family: var(--serif); font-weight: 600; font-size: 18px; line-height: 1.1; margin-top: 4px; }
.org-extended-tile .oxt-founded { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--ink-3); margin-top: 6px; }
.org-extended-tile.dsa .oxt-founded, .org-extended-tile:hover .oxt-founded { color: var(--paper-3); }
.org-extended-tile .oxt-cue { margin-top: auto; padding-top: 12px; font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; color: var(--red); text-transform: uppercase; }
.org-extended-tile.dsa .oxt-cue, .org-extended-tile:hover .oxt-cue { color: var(--red-pale); }

.org-modal-scrim {
  position: fixed; inset: 0; background: rgba(26,22,18,0.55);
  z-index: 100; display: flex; align-items: flex-start; justify-content: center;
  padding: 6vh 24px 24px;
  overflow-y: auto;
  animation: scrimIn 200ms ease;
}

/* --- Click-to-open image lightbox --- */
.img-pop-link {
  font-family: var(--mono); font-size: 11px; letter-spacing: .04em;
  color: var(--red); text-decoration: none; cursor: pointer;
  border-bottom: 1px solid var(--red); padding-bottom: 1px;
}
.img-pop-link:hover { color: var(--ink); border-color: var(--ink); }
.img-pop-scrim {
  position: fixed; inset: 0; background: rgba(26,22,18,0.78);
  z-index: 120; display: flex; align-items: flex-start; justify-content: center;
  padding: 5vh 20px 20px; overflow-y: auto;
  animation: scrimIn 180ms ease;
}
.img-pop {
  position: relative; max-width: 720px; width: 100%;
  background: var(--paper); border: 2px solid var(--ink);
  box-shadow: 0 20px 60px rgba(26,22,18,0.5);
  animation: modalIn 200ms cubic-bezier(.2,.7,.2,1);
}
.img-pop img { display: block; width: 100%; height: auto; }
.img-pop-cap {
  padding: 12px 16px; border-top: 1px solid var(--ink);
  font-family: var(--mono); font-size: 11px; line-height: 1.5;
  letter-spacing: .02em; color: var(--ink-2); background: var(--paper-2);
}
.img-pop-close {
  position: absolute; top: 10px; right: 10px;
  background: var(--paper); border: 1px solid var(--ink); color: var(--ink);
  width: 34px; height: 34px; font-size: 22px; line-height: 1;
  cursor: pointer; z-index: 1;
}
.img-pop-close:hover { background: var(--ink); color: var(--paper); }
/* clickable screenshot thumbnail */
.img-pop-thumb {
  display: block; width: 100%; padding: 0; border: 1px solid var(--ink); background: var(--paper);
  cursor: pointer; position: relative; overflow: hidden; line-height: 0;
}
.img-pop-thumb img { display: block; width: 100%; height: 150px; object-fit: cover; object-position: top; filter: grayscale(0.15); }
.img-pop-thumb:hover img { filter: none; }
.img-pop-thumb-cue {
  display: block; line-height: 1.2; padding: 7px 10px; border-top: 1px solid var(--rule);
  font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--red); text-align: left;
}
.img-pop-thumb:hover .img-pop-thumb-cue { background: var(--red); color: var(--paper); }

/* Yemen Rises — receipts grid */
.zn-lead { font-family: var(--serif); font-size: 15.5px; line-height: 1.55; color: var(--ink); margin: 12px 0 14px; max-width: 900px; }
.zn-lead strong { font-family: var(--mono); font-size: 13px; letter-spacing: .02em; color: var(--red); }
.zn-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 6px; }
.zn-card { display: flex; flex-direction: column; gap: 10px; border-top: 3px solid var(--red); padding-top: 12px; }
.zn-card-quote { font-family: var(--serif); font-size: 14.5px; line-height: 1.5; color: var(--ink); }
.zn-card-meta { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--ink-3); }
@media (max-width: 720px) { .zn-grid { grid-template-columns: 1fr; } }
@keyframes scrimIn { from { opacity: 0; } to { opacity: 1; } }
.org-modal {
  background: var(--paper); border: 2px solid var(--ink);
  box-shadow: 0 20px 60px rgba(26,22,18,0.45);
  max-width: 880px; width: 100%;
  position: relative;
  animation: modalIn 220ms cubic-bezier(.2,.7,.2,1);
}
@keyframes modalIn { from { transform: translateY(20px); opacity: 0; } to { transform: none; opacity: 1; } }
.org-modal-close {
  position: absolute; top: 12px; right: 12px;
  background: var(--paper); border: 1px solid var(--ink); color: var(--ink);
  width: 36px; height: 36px; font-size: 22px; line-height: 1;
  font-family: var(--serif); cursor: pointer;
  z-index: 1;
}
.org-modal-close:hover { background: var(--ink); color: var(--paper); }
.org-modal-head { padding: 32px 36px 24px; border-bottom: 1px solid var(--ink); background: var(--paper-2); }
.org-modal-head.dsa { background: var(--ink); color: var(--paper); }
.org-modal-head .om-role { font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--red); }
.org-modal-head.dsa .om-role { color: var(--rose); }
.org-modal-head .om-name { font-family: var(--serif); font-weight: 600; font-size: 38px; line-height: 1.05; letter-spacing: -0.012em; margin-top: 6px; }
.org-modal-head .om-full { font-family: var(--mono); font-size: 11.5px; letter-spacing: .04em; color: var(--ink-3); margin-top: 8px; }
.org-modal-head.dsa .om-full { color: var(--paper-3); }
.org-modal-head .om-fn { font-family: var(--serif); font-style: italic; font-size: 17px; line-height: 1.45; color: var(--ink-2); margin-top: 16px; max-width: 720px; }
.org-modal-head.dsa .om-fn { color: var(--paper-3); }
.org-modal-body { padding: 18px 36px 32px; }
.org-modal-body .om-row { padding: 16px 0; border-top: 1px dashed var(--rule); display: grid; grid-template-columns: 200px 1fr; gap: 24px; align-items: baseline; }
.org-modal-body .om-row:first-child { border-top: none; }
.org-modal-body .om-key { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.org-modal-body .om-val { font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--ink); }

/* Inline org dossier panel (unified with the NPC roster's inline pattern) */
.org-detail {
  margin-top: 8px;
  background: var(--paper);
  border: 2px solid var(--ink);
  position: relative;
  animation: revealIn 0.4s var(--ease-out) backwards;
}
.org-extended-tile.open { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.org-extended-tile.open .oxt-role, .org-extended-tile.open .oxt-cue { color: var(--red-pale); }
.org-extended-tile.open .oxt-founded { color: var(--paper-3); }
.org-extended-tile.dsa.open { background: var(--red); border-color: var(--red); }

@media (max-width: 900px) {
  .org-extended-grid { grid-template-columns: repeat(3, 1fr); }
  .org-modal-head { padding: 26px 22px 20px; }
  .org-modal-head .om-name { font-size: 30px; }
  .org-modal-body { padding: 14px 22px 24px; }
  .org-modal-body .om-row { grid-template-columns: 1fr; gap: 6px; padding: 14px 0; }
}
@media (max-width: 720px) {
  .org-extended-grid { grid-template-columns: repeat(2, 1fr); }
  .org-modal-scrim { padding: 4vh 12px 12px; }
}

/* ============================================================
   MASK OFF MAERSK — feature-story treatment
   ============================================================ */
.mom { position: relative; margin-top: 64px; }
.mom-rule { display: grid; grid-template-columns: 12px 1fr 12px; align-items: center; gap: 14px; margin-bottom: 14px; }
.mom-rule .bar { height: 2px; background: var(--ink); }
.mom-rule .corner { width: 12px; height: 12px; border: 2px solid var(--ink); }
.mom-eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--red); padding: 0 4px; white-space: nowrap; }

.mom-hero {
  background: var(--ink); color: var(--paper);
  padding: 56px 56px 48px;
  position: relative;
  overflow: hidden;
}
.mom-hero::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(45deg, transparent 0 24px, rgba(241,233,215,.025) 24px 25px);
  pointer-events: none;
}
.mom-hero-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 56px; align-items: flex-end; position: relative; }
.mom-stamp {
  display: inline-block; font-family: var(--mono); font-weight: 600; font-size: 10.5px;
  letter-spacing: .2em; text-transform: uppercase; color: var(--red-pale);
  border: 1.5px solid var(--red); padding: 5px 11px;
  background: rgba(140,28,28,.18);
  transform: rotate(-1.5deg); margin-bottom: 22px;
}
.mom-title {
  font-family: var(--serif); font-weight: 700;
  font-size: clamp(48px, 6vw, 84px); line-height: 0.92; letter-spacing: -0.022em;
  color: var(--paper); margin: 0 0 18px;
}
.mom-title em { font-style: italic; color: var(--red-pale); font-weight: 600; }
.mom-deck {
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: 22px; line-height: 1.4; color: var(--paper-3); max-width: 620px;
}
.mom-hero .stat-stack { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.mom-hero .stat-card {
  border-left: 3px solid var(--red);
  padding: 4px 0 4px 18px;
}
.mom-hero .stat-card .big {
  font-family: var(--serif); font-weight: 700; font-size: 56px;
  line-height: 1; letter-spacing: -0.016em; color: var(--paper);
}
.mom-hero .stat-card .lbl {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red-pale); margin-top: 8px;
}
.mom-hero .stat-card .note {
  font-family: var(--serif); font-size: 14.5px; color: var(--paper-3);
  margin-top: 4px; line-height: 1.4;
}

/* Origin / strategy two-up */
.mom-strategy {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  background: var(--paper);
  border: 1px solid var(--ink); border-top: none;
}
.mom-strategy .col { padding: 30px 36px; border-right: 1px solid var(--ink); }
.mom-strategy .col:last-child { border-right: none; background: var(--paper-2); }
.mom-strategy .col .ec {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--red); margin-bottom: 10px;
}
.mom-strategy .col h4 {
  font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.1;
  letter-spacing: -0.008em; margin: 0 0 14px;
}
.mom-strategy .col p {
  font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--ink-2);
  margin: 0 0 12px;
}

/* Victories — numbered timeline */
.mom-section { padding: 56px 0 0; }
.mom-section-head {
  display: grid; grid-template-columns: 130px 1fr; gap: 32px; align-items: baseline; margin-bottom: 28px;
}
.mom-section-num {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: .18em; color: var(--red);
  text-transform: uppercase;
}
.mom-section-num::before { content: "§ "; }
.mom-section-title {
  font-family: var(--serif); font-weight: 600; font-size: 32px; line-height: 1.06;
  letter-spacing: -0.012em;
}
.mom-section-sub {
  font-family: var(--serif); font-style: italic; font-size: 17px; line-height: 1.45;
  color: var(--ink-2); margin-top: 8px; max-width: 720px;
}

.mom-victories {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border-top: 2px solid var(--ink); border-left: 1px solid var(--ink);
}
.mom-victory {
  padding: 26px 24px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  background: var(--paper); display: grid; grid-template-columns: 48px 1fr; gap: 18px;
  position: relative;
  transition: background 180ms;
}
.mom-victory:hover { background: var(--paper-2); }
.mom-victory:nth-child(2n) { border-right: none; }
.mom-victory .n {
  font-family: var(--serif); font-weight: 700; font-size: 38px; line-height: 0.9;
  color: var(--red); letter-spacing: -0.02em;
}
.mom-victory .where {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red); margin-bottom: 6px;
}
.mom-victory .body {
  font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: var(--ink);
}

/* DSA adoption — annotated steps */
.mom-adoption {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 0;
  background: var(--paper);
  border: 1px solid var(--ink);
}
.mom-step {
  padding: 24px 22px 22px; border-right: 1px solid var(--rule);
  background: var(--paper); position: relative;
}
.mom-step:last-child { border-right: none; }
.mom-step .date {
  display: inline-block;
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--paper); background: var(--ink); padding: 3px 8px;
  margin-bottom: 12px;
}
.mom-step .step-body {
  font-family: var(--serif); font-size: 14px; line-height: 1.5; color: var(--ink);
}
.mom-step.featured { background: var(--red); color: var(--paper); border-right-color: var(--red-deep); }
.mom-step.featured .date { background: var(--paper); color: var(--red); }
.mom-step.featured .step-body { color: var(--paper); }
.mom-step.featured .step-body strong { color: var(--paper); }

/* Rhetoric callout */
.mom-callout {
  margin-top: 40px;
  display: grid; grid-template-columns: 220px 1fr; gap: 36px; align-items: flex-start;
  background: var(--paper-3); padding: 36px 40px;
  border: 1px solid var(--ink);
}
.mom-callout .label {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red);
}
.mom-callout .label .from { display: block; color: var(--ink-2); margin-top: 6px; text-transform: none; letter-spacing: .04em; font-size: 11px; }
.mom-callout .quote {
  font-family: var(--serif); font-size: 22px; line-height: 1.35; font-style: italic;
  color: var(--ink); letter-spacing: -0.005em;
}

.mom-pull {
  margin-top: 40px;
  background: var(--ink); color: var(--paper);
  padding: 40px 40px;
  border-left: 4px solid var(--red);
}
.mom-pull .body {
  font-family: var(--serif); font-size: 26px; line-height: 1.25; letter-spacing: -0.008em; font-weight: 500;
  color: var(--paper);
}
.mom-pull .attr {
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red-pale); margin-top: 18px;
}

@media (max-width: 900px) {
  .mom-hero { padding: 36px 28px 32px; }
  .mom-hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .mom-strategy { grid-template-columns: 1fr; }
  .mom-strategy .col { border-right: none; border-bottom: 1px solid var(--ink); }
  .mom-strategy .col:last-child { border-bottom: none; }
  .mom-victories { grid-template-columns: 1fr; }
  .mom-victory { border-right: none; }
  .mom-adoption { grid-template-columns: 1fr 1fr; }
  .mom-step { border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
  .mom-callout { grid-template-columns: 1fr; padding: 26px 22px; gap: 14px; }
  .mom-section-head { grid-template-columns: 1fr; gap: 8px; }
}

/* ============================================================
   NPC ROSTER — editorial dossier with click-to-expand
   ============================================================ */
.npc-wrap { margin-top: 64px; }
.npc-headline-block {
  display: grid; grid-template-columns: 1fr 280px; gap: 36px; align-items: flex-end;
  padding-bottom: 22px;
  border-bottom: 3px solid var(--ink);
  margin-bottom: 0;
}
.npc-tag-cluster { display: flex; flex-wrap: wrap; gap: 8px; }
.npc-tag-stat {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  background: var(--ink); color: var(--paper); padding: 5px 11px;
}
.npc-tag-stat.red { background: var(--red); }
.npc-tag-stat.outline { background: transparent; color: var(--ink); border: 1px solid var(--ink); }

.npc-intro {
  font-family: var(--serif); font-size: 17px; line-height: 1.55; color: var(--ink-2);
  margin: 22px 0 28px; max-width: 880px;
}

/* Master–detail roster */
.npc-layout {
  display: grid; grid-template-columns: 290px 1fr; gap: 24px;
  align-items: start; margin-top: 24px;
}
.npc-list {
  border: 1px solid var(--ink); background: var(--paper);
  position: sticky; top: 72px;
}
.npc-row {
  display: flex; align-items: center; gap: 13px; width: 100%;
  padding: 13px 15px; text-align: left; font: inherit;
  background: var(--paper); border: none; border-bottom: 1px solid var(--rule);
  cursor: pointer; transition: background var(--t-fast);
}
.npc-row:last-child { border-bottom: none; }
.npc-row:hover { background: var(--paper-2); }
.npc-row.active { background: var(--red); }
.npc-row-ini {
  width: 40px; height: 40px; flex: none;
  display: grid; place-items: center;
  background: var(--ink); color: var(--paper);
  font-family: var(--serif); font-weight: 600; font-size: 16px;
}
.npc-row.active .npc-row-ini { background: var(--paper); color: var(--red); }
.npc-row-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.npc-row-name {
  font-family: var(--serif); font-weight: 600; font-size: 16px; line-height: 1.15; color: var(--ink);
}
.npc-row.active .npc-row-name { color: var(--paper); }
.npc-row-chapter {
  font-family: var(--mono); font-size: 8.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-3);
}
.npc-row.active .npc-row-chapter { color: var(--red-pale); }

/* Detail dossier — light panel */
.npc-detail {
  background: var(--paper-2); color: var(--ink);
  border: 1px solid var(--ink);
  animation: revealIn 0.3s var(--ease-out) backwards;
}
.npc-detail-head {
  padding: 30px 34px 24px;
  border-bottom: 1px solid var(--rule);
}
.npc-detail-head .chapter-line {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red); margin-bottom: 10px;
}
.npc-detail-head h3 {
  font-family: var(--serif); font-weight: 600;
  font-size: 40px; line-height: 1.04; letter-spacing: -0.018em;
  color: var(--ink); margin: 0 0 12px;
}
.npc-detail-head .roleline {
  font-family: var(--serif); font-style: italic; font-size: 17px; line-height: 1.45;
  color: var(--ink-2); max-width: 680px;
}
.npc-detail-tags { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 6px; }
.npc-detail-tags .pill {
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  padding: 4px 10px; border: 1px solid var(--red); color: var(--red);
}

.npc-tabs-row {
  display: flex; gap: 0; padding: 0 34px;
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
}
.npc-tab {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); background: transparent; border: none;
  padding: 14px 16px; cursor: pointer;
  border-bottom: 3px solid transparent; margin-bottom: -1px;
  transition: color var(--t-fast);
}
.npc-tab:hover { color: var(--ink); }
.npc-tab.active { color: var(--ink); border-bottom-color: var(--red); }
.npc-tab .count {
  display: inline-block; margin-left: 7px; padding: 1px 6px;
  background: var(--red); color: var(--paper); font-size: 9.5px; font-weight: 600;
}

.npc-tab-panel {
  padding: 28px 34px 32px;
  font-family: var(--serif); font-size: 16.5px; line-height: 1.6; color: var(--ink);
}
.npc-tab-panel p { margin: 0 0 14px; color: var(--ink-2); }
.npc-tab-panel p:last-child { margin-bottom: 0; }
.npc-tab-panel .statement-list { display: grid; gap: 12px; }
.npc-tab-panel .statement {
  background: var(--paper);
  border-left: 3px solid var(--red);
  padding: 15px 18px;
  font-family: var(--serif); font-size: 15.5px; line-height: 1.55; color: var(--ink);
}
.npc-tab-panel .statement-proof {
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--rule);
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 14px;
}
.npc-tab-panel .statement-proof-label {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--red);
}
.npc-tab-panel .statement-proof .src-link { font-size: 11px; }
.npc-tab-panel .analysis-block {
  background: var(--red); color: var(--paper);
  padding: 22px 24px;
}
.npc-tab-panel .analysis-block::before {
  content: "ANALYSIS";
  display: block; font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  color: rgba(241,233,215,.8); margin-bottom: 8px;
}
.npc-tab-panel .analysis-block .text {
  font-family: var(--serif); font-style: italic; font-size: 16.5px; line-height: 1.5;
  color: var(--paper);
}
.npc-tab-panel .sources-strip { margin-top: 20px; }

.npc-disclaimer {
  margin-top: 18px; padding: 16px 22px;
  background: var(--paper-2); border: 1px dashed var(--rule);
  font-family: var(--mono); font-size: 10.5px; line-height: 1.55; letter-spacing: .04em; color: var(--ink-2);
}
.npc-disclaimer strong { color: var(--red); }

@media (max-width: 1100px) {
  .npc-layout { grid-template-columns: 1fr; }
  .npc-list { position: static; }
}
@media (max-width: 720px) {
  .npc-headline-block { grid-template-columns: 1fr; gap: 16px; }
  .npc-detail-head { padding: 24px 22px 20px; }
  .npc-detail-head h3 { font-size: 30px; }
  .npc-tabs-row { padding: 0 14px; flex-wrap: wrap; }
  .npc-tab { padding: 12px 11px; }
  .npc-tab-panel { padding: 22px 22px 26px; }
}

/* ============================================================
   ARMS-EMBARGO SPECTRUM — five-tactic continuum
   ============================================================ */
.aes { margin-top: 64px; }
.aes-head {
  display: grid; grid-template-columns: 130px 1fr; gap: 32px; align-items: baseline; margin-bottom: 28px;
}
.aes-num { font-family: var(--mono); font-size: 11.5px; letter-spacing: .18em; color: var(--red); text-transform: uppercase; }
.aes-num::before { content: "§ "; }
.aes-title { font-family: var(--serif); font-weight: 600; font-size: 32px; line-height: 1.06; letter-spacing: -0.012em; }
.aes-sub { font-family: var(--serif); font-style: italic; font-size: 17px; line-height: 1.45; color: var(--ink-2); margin-top: 8px; max-width: 760px; }

.aes-strip {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
  margin-top: 16px;
}
.aes-tile {
  background: var(--paper); border: 1px solid var(--ink);
  padding: 24px 20px 22px;
  display: flex; flex-direction: column; min-height: 300px;
  position: relative; cursor: pointer;
  transition: transform 180ms var(--ease-out), box-shadow 180ms var(--ease-out), border-color 180ms;
}
.aes-tile:hover { transform: translateY(-3px); }
.aes-tile.active {
  border-color: var(--red);
  box-shadow: 5px 5px 0 var(--red);
  transform: translateY(-3px);
}
.aes-accent { position: absolute; top: 0; left: 0; right: 0; height: 7px; }
.aes-rung { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.aes-rung-n {
  font-family: var(--serif); font-weight: 700; font-size: 30px; line-height: 1;
  color: var(--paper-3); letter-spacing: -0.02em;
}
.aes-tile.active .aes-rung-n, .aes-tile.traced .aes-rung-n { color: var(--red); }
.aes-rung-check {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red); font-weight: 600;
}
.aes-tile .label {
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--red); margin-bottom: 10px;
}
.aes-tile .title {
  font-family: var(--serif); font-weight: 600; font-size: 21px; line-height: 1.12;
  letter-spacing: -0.008em; margin-bottom: 12px;
}
.aes-tile .body {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.5; color: var(--ink-2);
}
.aes-actors {
  margin-top: auto; padding-top: 14px; border-top: 1px solid var(--rule);
  font-family: var(--mono); font-size: 10px; letter-spacing: .1em; color: var(--ink-3);
  text-transform: uppercase; line-height: 1.4;
}

.aes-rail {
  margin-top: 24px;
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px;
}
.aes-rail-end {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink);
}
.aes-rail-bar {
  height: 8px; border-radius: 4px;
  background: linear-gradient(90deg, var(--ink) 0%, #5e1414 28%, var(--red) 55%, #b6584f 78%, var(--rose) 100%);
}
.aes-rail-line { position: relative; height: 3px; background: var(--ink-3); }
.aes-notch {
  position: absolute; top: 50%; width: 16px; height: 16px;
  transform: translate(-50%, -50%);
  border-radius: 50%; border: 2px solid var(--ink); background: var(--paper);
  cursor: pointer; padding: 0;
  transition: background 150ms, transform 150ms, border-color 150ms;
}
.aes-notch:hover { border-color: var(--red); }
.aes-notch.traced { background: var(--rose); }
.aes-notch.active {
  background: var(--red); border-color: var(--red);
  transform: translate(-50%, -50%) scale(1.45);
}

/* LA actions ledger */
.aes-actions {
  margin-top: 48px;
  border: 1px solid var(--ink);
  background: var(--paper);
}
.aes-actions-head {
  background: var(--ink); color: var(--paper);
  padding: 18px 24px;
  display: flex; justify-content: space-between; align-items: baseline; gap: 18px; flex-wrap: wrap;
}
.aes-actions-head .lbl { font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--red-pale); }
.aes-actions-head h4 { font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.1; margin: 4px 0 0; color: var(--paper); }
.aes-actions-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
.aes-action {
  padding: 22px 24px;
  border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  display: grid; grid-template-columns: 100px 1fr; gap: 18px;
}
.aes-action:nth-child(2n) { border-right: none; }
.aes-action:nth-last-child(-n+2) { border-bottom: none; }
.aes-action .when {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red); padding-top: 2px;
}
.aes-action .a-title {
  font-family: var(--serif); font-weight: 600; font-size: 17px; line-height: 1.25; margin-bottom: 6px;
}
.aes-action .a-body {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.5; color: var(--ink-2);
}

@media (max-width: 900px) {
  .aes-strip { grid-template-columns: 1fr 1fr; }
  .aes-actions-list { grid-template-columns: 1fr; }
  .aes-action { border-right: none; border-bottom: 1px solid var(--rule); }
  .aes-action:last-child { border-bottom: none; }
  .aes-head { grid-template-columns: 1fr; gap: 8px; }
}

/* ============================================================
   RADICAL CYCLE — street → vote conversion section
   ============================================================ */
.cycle-wrap {
  margin-top: 0;
  display: grid;
  grid-template-columns: auto 400px;
  gap: 32px;
  align-items: stretch;
  justify-content: center;
}
.cycle-stage {
  background: var(--paper);
  position: relative;
}
.cycle-svg-wrap {
  position: relative;
  height: 383px;
  aspect-ratio: 724/534;
}
.cycle-svg { width: 100%; height: 100%; display: block; }
.cycle-node-rect {
  fill: var(--paper-2);
  stroke: var(--ink); stroke-width: 1;
  transition: fill 200ms, stroke 200ms;
  cursor: pointer;
}
.cycle-node-rect:hover, .cycle-node-rect.active { fill: var(--red); stroke: var(--red); }
.cycle-node-title {
  font-family: var(--serif); font-weight: 600; font-size: 23px;
  fill: var(--red); pointer-events: none;
  letter-spacing: -0.005em;
  dominant-baseline: middle;
}
.cycle-node-title.on-dark { fill: var(--paper); }
.cycle-node-rect:hover + .cycle-node-title { fill: var(--paper); }
.cycle-node-sub {
  font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
  fill: var(--ink-2); pointer-events: none;
  dominant-baseline: middle;
}
.cycle-node-sub.on-dark { fill: var(--paper-3); }
.cycle-node-rect:hover ~ .cycle-node-sub { fill: var(--paper-3); }
.cycle-arrow { stroke: var(--red); stroke-width: 2.5; fill: none; }

.cycle-detail {
  padding: 26px 28px;
  background: var(--paper-2);
  border: 1px solid var(--ink);
  display: grid; grid-template-columns: 1fr; gap: 14px; align-content: start;
  animation: revealIn 0.35s var(--ease-out) backwards;
}
.cycle-detail .cd-num {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; color: var(--red); text-transform: uppercase;
  margin-bottom: 6px;
}
.cycle-detail .cd-name {
  font-family: var(--serif); font-weight: 600; font-size: 30px; line-height: 1.05; letter-spacing: -0.012em;
}
.cycle-detail .cd-sub {
  font-family: var(--serif); font-style: italic; font-size: 16px; color: var(--ink-2); margin-top: 6px;
}
.cycle-detail .cd-body {
  font-family: var(--serif); font-size: 16.5px; line-height: 1.55; color: var(--ink);
}

/* Stack the cycle diagram + detail when there isn't room side-by-side */
@media (max-width: 1120px) {
  .cycle-wrap { grid-template-columns: 1fr; }
  .cycle-svg-wrap { width: 100%; height: auto; }
}

/* Conversion stats strip */
.conv-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border-top: 1px solid var(--ink); border-left: 1px solid var(--ink);
  margin-top: 56px;
}
.conv-cell {
  padding: 26px 24px;
  border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  background: var(--paper);
}
.conv-cell .conv-big {
  font-family: var(--serif); font-weight: 700; font-size: 44px; line-height: 0.95;
  color: var(--red); letter-spacing: -0.02em; white-space: nowrap;
}
.conv-cell .conv-lbl {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); margin-top: 10px;
}
.conv-cell .conv-note {
  font-family: var(--serif); font-size: 14px; color: var(--ink-2); margin-top: 8px; line-height: 1.45;
}

/* Street actions timeline */
.street-actions {
  margin-top: 48px;
  border-top: 3px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.street-action {
  display: grid; grid-template-columns: 130px 1fr 1fr; gap: 24px;
  padding: 18px 0;
  border-bottom: 1px solid var(--rule);
  align-items: baseline;
}
.street-action:last-child { border-bottom: none; }
.street-action .sa-date {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: var(--red);
}
.street-action .sa-title {
  font-family: var(--serif); font-weight: 600; font-size: 18px; line-height: 1.2;
}
.street-action .sa-body {
  font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink-2);
}

@media (max-width: 900px) {
  .cycle-detail { grid-template-columns: 1fr; gap: 14px; padding: 22px 22px; }
  .conv-strip { grid-template-columns: 1fr 1fr; }
  .street-action { grid-template-columns: 1fr; gap: 6px; }
  .cycle-svg-wrap { aspect-ratio: 4/5; }
}

/* ============================================================
   BIG TENT — convergence thesis block
   ============================================================ */
.bt-wrap { margin-top: 64px; }
.bt-thesis {
  background: var(--paper-2); border: 1px solid var(--ink);
  padding: 32px 36px;
  display: grid; grid-template-columns: 180px 1fr; gap: 36px; align-items: flex-start;
  margin-bottom: 14px;
}
.bt-thesis .bt-stamp {
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em; color: var(--red);
  text-transform: uppercase;
  border: 1.5px solid var(--red); padding: 6px 10px; display: inline-block;
  background: rgba(140,28,28,.06);
  transform: rotate(-1.5deg);
  white-space: nowrap;
}
.bt-thesis .bt-thesis-body {
  font-family: var(--serif); font-size: 18px; line-height: 1.5; color: var(--ink);
  font-style: italic;
}
.bt-thesis .bt-thesis-body strong { font-style: normal; color: var(--red); font-weight: 600; }

.bt-doors {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 0;
  border-top: 1px solid var(--ink); border-left: 1px solid var(--ink);
}
.bt-door {
  padding: 22px 20px 24px;
  border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  background: var(--paper);
  display: flex; flex-direction: column; gap: 10px;
  min-height: 360px;
  transition: background 200ms;
}
.bt-door:hover { background: var(--paper-2); }
.bt-door .lbl { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; color: var(--red); text-transform: uppercase; }
.bt-door h4 {
  font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.1;
  letter-spacing: -0.008em; margin: 4px 0 6px;
}
.bt-door .orgs {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink-2);
  padding: 8px 0; border-top: 1px dashed var(--rule); border-bottom: 1px dashed var(--rule);
}
.bt-door .hook {
  font-family: var(--serif); font-style: italic; font-size: 14.5px; line-height: 1.4; color: var(--ink);
  margin: 4px 0;
}
.bt-door .conv {
  font-family: var(--serif); font-size: 14px; line-height: 1.5; color: var(--ink-2);
  margin-top: 8px;
}

.bt-funnel {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 0;
  align-items: center;
}
.bt-funnel .arrow-cell {
  text-align: center; padding: 14px 0;
  font-family: var(--serif); font-size: 26px; color: var(--red); line-height: 1;
}

.bt-end {
  background: var(--ink); color: var(--paper);
  border: 1px solid var(--ink);
  padding: 40px 44px;
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: flex-start;
}
.bt-end .bt-end-eyebrow { font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; color: var(--red-pale); text-transform: uppercase; }
.bt-end h3 {
  font-family: var(--serif); font-weight: 700; font-size: 44px; line-height: 1.0;
  letter-spacing: -0.02em; margin: 8px 0 18px; color: var(--paper);
}
.bt-end .bt-end-body {
  font-family: var(--serif); font-size: 17px; line-height: 1.55; color: var(--paper-3);
}
.bt-end .bt-end-quote {
  background: var(--red); color: var(--paper);
  padding: 26px 28px;
  font-family: var(--serif); font-style: italic; font-size: 22px; line-height: 1.3;
  border-left: 4px solid var(--red-deep);
}
.bt-end .bt-end-quote.primary {
  font-weight: 500;
}
.bt-end .bt-end-quote:not(.primary) {
  background: var(--red-deep);
  font-size: 19px;
  border-left-color: rgba(241,233,215,.35);
}
.bt-end .bt-end-quote .bt-end-qlink {
  display: inline-block;
  white-space: nowrap;
  margin-top: 12px;
  font-family: var(--mono); font-style: normal; font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--paper);
  text-decoration: none; border-bottom: 1px solid rgba(241,233,215,.45);
  padding-bottom: 2px;
}
.bt-end .bt-end-quote .bt-end-qlink:hover { border-bottom-color: var(--paper); }
.bt-end .bt-end-quote .qattr {
  font-family: var(--mono); font-style: normal; font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red-pale); margin-top: 16px;
}
.bt-quote-stack { display: flex; flex-direction: column; gap: 12px; }

/* === Quote wall (Big Tent + Machine sections) === */
.bt-wall, .mq-block { margin-top: 32px; background: var(--paper); border: 1px solid var(--ink); }
.bt-wall-head, .mq-head {
  padding: 26px 30px;
  background: var(--paper-2);
  border-bottom: 1px solid var(--ink);
}
.bt-wall-eyebrow, .mq-eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red); margin-bottom: 6px;
}
.bt-wall-head h4, .mq-head h4 {
  font-family: var(--serif); font-weight: 600; font-size: 26px; line-height: 1.1;
  letter-spacing: -0.012em; margin: 0 0 10px;
}
.bt-wall-head p, .mq-head p {
  font-family: var(--serif); font-size: 15.5px; line-height: 1.55; color: var(--ink-2);
  margin: 0; max-width: 820px;
}
.bt-wall-grid, .mq-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
}
.bt-wall-tile, .mq-tile {
  padding: 22px 22px 18px;
  border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  background: var(--paper);
  display: flex; flex-direction: column; gap: 12px;
  transition: background 180ms;
}
.bt-wall-tile:nth-child(3n), .mq-tile:nth-child(3n) { border-right: none; }
.bt-wall-tile:hover, .mq-tile:hover { background: var(--paper-2); }
.bt-wall-chip, .mq-chip {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase;
  padding: 3px 8px;
  background: var(--red); color: var(--paper);
  align-self: flex-start;
}
.bt-wall-tile.theme-pro-hamas .bt-wall-chip, .mq-tile.theme-pro-hamas .mq-chip { background: var(--ochre); }
.bt-wall-tile.theme-revolutionary .bt-wall-chip { background: var(--ink); }
.mq-tile.theme-pipeline .mq-chip { background: var(--stamp-blue); }
.mq-tile.theme-police-abolition .mq-chip { background: var(--ink); }

.bt-wall-text, .mq-text {
  font-family: var(--serif); font-size: 17px; line-height: 1.5; color: var(--ink);
  font-style: italic;
}
.bt-wall-attr, .mq-attr {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink-3);
  line-height: 1.4;
}
.bt-wall-link, .mq-link {
  margin-top: auto; padding-top: 6px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red); text-decoration: none;
  align-self: flex-start;
}
.bt-wall-link:hover, .mq-link:hover { text-decoration: underline; }
.mq-links { margin-top: auto; padding-top: 6px; display: flex; flex-wrap: wrap; gap: 4px 16px; }
.mq-links .mq-link { margin-top: 0; padding-top: 0; }
.mom-quotes { margin-top: 22px; display: grid; gap: 14px; }
.mom-quotes-head { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.mom-quote { border-left: 3px solid var(--red); padding: 12px 16px; background: var(--paper-2); }
.mom-quote-text { font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: var(--ink); }
.mom-quote-attr { font-family: var(--mono); font-size: 11px; color: var(--ink-3); margin-top: 8px; }
.mom-quote-links { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; }

/* The first tile (primary anti-American) — darker for visual hierarchy */
.bt-wall-tile.theme-anti-american:nth-child(1) {
  background: var(--ink); color: var(--paper);
}
.bt-wall-tile.theme-anti-american:nth-child(1) .bt-wall-text { color: var(--paper); }
.bt-wall-tile.theme-anti-american:nth-child(1) .bt-wall-attr { color: var(--paper-3); }
.bt-wall-tile.theme-anti-american:nth-child(1) .bt-wall-link { color: var(--red-pale); }

/* === National DSA section === */
.ndsa-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border: 1px solid var(--ink); margin-bottom: 8px;
}
.ndsa-stat { padding: 20px 22px; border-right: 1px solid var(--ink); background: var(--paper); }
.ndsa-stat:last-child { border-right: none; }
.ndsa-stat-num {
  font-family: var(--serif); font-weight: 600; font-size: 40px; line-height: .95;
  color: var(--red); letter-spacing: -.02em;
}
.ndsa-stat-lbl {
  font-family: var(--mono); font-size: 10px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-3); margin-top: 8px; line-height: 1.3;
}
.ndsa-topic { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--rule); }
.ndsa-topic:first-of-type { border-top: none; padding-top: 0; }
.ndsa-topic-head { margin-bottom: 10px; }
.ndsa-bullets {
  margin: 16px 0 0; padding: 0; list-style: none;
  display: grid; gap: 0; border: 1px solid var(--rule);
}
.ndsa-bullets li {
  font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink);
  padding: 12px 16px; border-top: 1px solid var(--rule); position: relative; padding-left: 30px;
}
.ndsa-bullets li:first-child { border-top: none; }
.ndsa-bullets li::before {
  content: "—"; position: absolute; left: 14px; color: var(--red); font-weight: 600;
}
/* Leadership roster */
.ndsa-roster { margin-top: 18px; }
.ndsa-cochairs { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.ndsa-cochair {
  display: block; text-decoration: none; flex: 1 1 220px; background: var(--red); color: var(--paper);
  border: 1px solid var(--ink); padding: 16px 18px; box-shadow: var(--shadow-hard);
  transition: transform .12s ease;
}
.ndsa-cochair:hover { transform: translateY(-3px); }
.ndsa-cochair-name { font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.05; }
.ndsa-cochair-role {
  font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--red-pale); margin-top: 6px;
}
.ndsa-roster-note {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; color: var(--ink-3);
  margin: 14px 0 8px; text-transform: uppercase;
}
.ndsa-roster-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border: 1px solid var(--rule);
}
.ndsa-npc {
  display: flex; flex-direction: column; gap: 3px; text-decoration: none;
  padding: 10px 14px; border-top: 1px solid var(--rule); border-right: 1px solid var(--rule);
  transition: background .12s ease;
}
.ndsa-npc:hover { background: var(--paper-2); }
.ndsa-npc-name { font-family: var(--sans); font-size: 13.5px; font-weight: 600; color: var(--ink); }
.ndsa-npc-chapter { font-family: var(--mono); font-size: 9.5px; letter-spacing: .04em; color: var(--red); text-transform: uppercase; }
.ndsa-npc:nth-child(4n) { border-right: none; }
.ndsa-sc { color: var(--red); margin-right: 5px; }
/* Pull quote */
.ndsa-pull {
  margin: 4px 0 16px; padding: 18px 22px; background: var(--ink); color: var(--paper);
  border-left: 4px solid var(--red); box-shadow: var(--shadow-hard);
}
.ndsa-pull-text { font-family: var(--serif); font-weight: 600; font-size: 26px; line-height: 1.16; letter-spacing: -.01em; }
.ndsa-pull-attr { font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--rose); margin-top: 12px; }
/* Operating modes */
.ndsa-modes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--ink); margin-top: 16px; }
.ndsa-mode { padding: 18px 20px; border-right: 1px solid var(--rule); background: var(--paper); }
.ndsa-mode:last-child { border-right: none; }
.ndsa-mode-k { font-family: var(--serif); font-weight: 600; font-size: 30px; color: var(--red); line-height: 1; }
.ndsa-mode-name { font-family: var(--serif); font-weight: 600; font-size: 17px; margin: 8px 0 6px; }
.ndsa-mode-body { font-family: var(--serif); font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.ndsa-modes-note { font-family: var(--serif); font-style: italic; font-size: 15px; color: var(--ink); margin-top: 12px; padding-left: 14px; border-left: 3px solid var(--red); }
/* Caucus provocative quote */
.ndsa-caucus-quote {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.45; color: var(--ink);
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--rule); font-style: italic;
}
.ndsa-caucus-quote .ndsa-quote-link { font-style: normal; margin-top: 8px; }
/* Structure relationship diagram */
.ndsa-diagram { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px; margin-top: 18px; align-items: start; }
.ndsa-dia-main { display: flex; flex-direction: column; align-items: stretch; }
.ndsa-dia-box {
  border: 1px solid var(--ink); background: var(--paper); padding: 12px 16px; text-align: center;
  font-family: var(--serif); font-weight: 600; font-size: 16px; line-height: 1.2; color: var(--ink);
}
.ndsa-dia-box span { display: block; font-family: var(--mono); font-weight: 400; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin-top: 5px; }
.ndsa-dia-box.base { background: var(--paper-3); }
.ndsa-dia-box.hot { background: var(--red); color: var(--paper); box-shadow: var(--shadow-hard); }
.ndsa-dia-box.hot span { color: var(--red-pale); }
.ndsa-dia-arrow { text-align: center; font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--red); padding: 7px 0; }
.ndsa-dia-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ndsa-dia-box.sm { font-size: 13px; padding: 10px 10px; }
.ndsa-dia-cross { border: 1px dashed var(--ink-3); padding: 14px; background: var(--paper-2); align-self: stretch; display: flex; flex-direction: column; gap: 12px; }
.ndsa-dia-cross-label { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.ndsa-dia-box.caucus { background: var(--ink); color: var(--paper); text-align: left; }
.ndsa-dia-box.caucus span { color: var(--paper-3); }
.ndsa-dia-box.ydsa { text-align: left; }
/* Caucus spectrum */
.ndsa-spectrum { margin-top: 16px; }
.ndsa-spectrum-axis { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.ndsa-spectrum-pole { font-family: var(--mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.ndsa-spectrum-pole.left { color: var(--red); }
.ndsa-spectrum-pole.right { color: var(--ink-3); }
.ndsa-spectrum-bar { flex: 1; height: 4px; background: linear-gradient(90deg, var(--red) 0%, var(--ochre) 60%, var(--ink-3) 100%); }
.ndsa-spectrum-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.ndsa-band { border: 1px solid var(--ink); background: var(--paper); display: flex; flex-direction: column; }
.ndsa-band-head { padding: 12px 14px; border-bottom: 1px solid var(--ink); }
.ndsa-band-name { font-family: var(--serif); font-weight: 700; font-size: 16px; line-height: 1.1; }
.ndsa-band-blurb { font-family: var(--mono); font-size: 9.5px; letter-spacing: .03em; color: var(--ink-3); margin-top: 5px; line-height: 1.35; }
.ndsa-band.tone-farleft .ndsa-band-head { background: var(--red-deep); }
.ndsa-band.tone-left .ndsa-band-head { background: var(--red); }
.ndsa-band.tone-mid .ndsa-band-head { background: var(--ochre); }
.ndsa-band.tone-right .ndsa-band-head { background: var(--ink); }
.ndsa-band.tone-farleft .ndsa-band-name, .ndsa-band.tone-left .ndsa-band-name,
.ndsa-band.tone-mid .ndsa-band-name, .ndsa-band.tone-right .ndsa-band-name { color: var(--paper); }
.ndsa-band.tone-farleft .ndsa-band-blurb, .ndsa-band.tone-left .ndsa-band-blurb,
.ndsa-band.tone-mid .ndsa-band-blurb, .ndsa-band.tone-right .ndsa-band-blurb { color: var(--paper-3); }
.ndsa-band .ndsa-caucus { padding: 12px 14px; border-top: 1px solid var(--rule); border-right: none; background: transparent; }
.ndsa-band .ndsa-caucus:first-of-type { border-top: none; }
.ndsa-band .ndsa-caucus-name { font-size: 15px; }
.ndsa-band .ndsa-caucus-note { font-size: 12.5px; }
.ndsa-band .ndsa-caucus-quote { font-size: 13px; }
/* Growth chart */
.ndsa-growth-chart { margin-top: 16px; border: 1px solid var(--ink); background: var(--paper); padding: 14px 16px 0; }
.ndsa-growth-detail { border-top: 1px solid var(--rule); margin-top: 6px; padding: 14px 2px 16px; }
.ndsa-growth-detail-head { display: flex; align-items: baseline; gap: 14px; }
.ndsa-growth-year { font-family: var(--serif); font-weight: 600; font-size: 26px; color: var(--ink); }
.ndsa-growth-num { font-family: var(--mono); font-size: 12px; letter-spacing: .06em; color: var(--red); text-transform: uppercase; }
.ndsa-growth-detail p { font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink-2); margin: 8px 0 0; }
/* PYM interactive timeline */
.ndsa-pym { margin-top: 16px; border: 1px solid var(--ink); background: var(--paper); }
.ndsa-pym-rail { display: flex; overflow-x: auto; border-bottom: 1px solid var(--ink); background: var(--paper-2); }
.ndsa-pym-node {
  flex: 0 0 auto; min-width: 120px; max-width: 160px; text-align: left; cursor: pointer;
  background: transparent; border: none; border-right: 1px solid var(--rule);
  padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 5px;
  border-bottom: 3px solid transparent;
}
.ndsa-pym-node:hover { background: var(--paper); }
.ndsa-pym-node.active { background: var(--paper); border-bottom-color: var(--red); }
.ndsa-pym-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--ink); }
.ndsa-pym-node.active .ndsa-pym-dot { background: var(--red); }
.ndsa-pym-date { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.ndsa-pym-label { font-family: var(--serif); font-weight: 600; font-size: 14px; line-height: 1.15; color: var(--ink); }
.ndsa-pym-detail { padding: 20px 22px; }
.ndsa-pym-detail-date { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.ndsa-pym-detail-title { font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.1; margin: 4px 0 8px; }
.ndsa-pym-detail p { font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: var(--ink); margin: 0; }
.ndsa-pym-detail .ndsa-quote-link { margin-top: 12px; }
/* Caucus grid */
.ndsa-caucus-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 0;
  border: 1px solid var(--ink); margin-top: 16px;
}
.ndsa-caucus {
  padding: 16px 18px; border-right: 1px solid var(--rule); border-top: 1px solid var(--rule);
  background: var(--paper);
}
.ndsa-caucus:nth-child(2n) { border-right: none; }
.ndsa-caucus:nth-child(1), .ndsa-caucus:nth-child(2) { border-top: none; }
.ndsa-caucus-name { font-family: var(--serif); font-weight: 600; font-size: 17px; line-height: 1.1; }
.ndsa-caucus-note { font-family: var(--serif); font-size: 14px; line-height: 1.45; color: var(--ink-2); margin-top: 6px; }
.ndsa-caucus .src-link { margin-top: 10px; display: inline-block; }
/* Quote cards */
.ndsa-quotes {
  margin-top: 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border: 1px solid var(--ink);
}
.ndsa-quote {
  padding: 18px 20px; border-right: 1px solid var(--rule); border-top: 1px solid var(--rule);
  border-left: 3px solid var(--red); background: var(--paper);
}
.ndsa-quote:nth-child(2n) { border-right: none; }
.ndsa-quote:nth-child(1), .ndsa-quote:nth-child(2) { border-top: none; }
.ndsa-quote-text {
  font-family: var(--serif); font-size: 16px; line-height: 1.4; color: var(--ink); font-weight: 500;
}
.ndsa-quote-attr {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink-3);
  text-transform: uppercase; margin-top: 10px; line-height: 1.4;
}
.ndsa-quote-link {
  display: inline-block; margin-top: 10px; font-family: var(--mono); font-size: 10px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--red); text-decoration: none;
  border-bottom: 1px solid var(--red-pale);
}
.ndsa-quote-link:hover { border-bottom-color: var(--red); }
.ndsa-quote-links { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: baseline; }

/* --- Growth: structural-conditions equation --- */
.growth-eq-wrap { margin: 22px 0 8px; }
.growth-eq {
  display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; gap: 12px;
}
.growth-eq-box {
  border: 2px solid var(--red); background: var(--paper);
  padding: 18px 16px; display: flex; flex-direction: column; justify-content: center; text-align: center;
}
.growth-eq-box.out { background: var(--red); border-color: var(--red); }
.growth-eq-kicker {
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--red); margin-bottom: 8px;
}
.growth-eq-box.out .growth-eq-kicker { color: var(--rose); }
.growth-eq-label {
  font-family: var(--sans); font-weight: 700; font-size: 18px; line-height: 1.15; color: var(--ink);
}
.growth-eq-box.out .growth-eq-label { color: var(--paper); }
.growth-eq-note {
  font-family: var(--mono); font-size: 10.5px; line-height: 1.4; color: var(--ink-3); margin-top: 8px;
}
.growth-eq-op {
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-weight: 700; font-size: 34px; color: var(--ink);
}
.growth-eq-caption {
  font-family: var(--serif); font-style: italic; font-size: 14.5px; line-height: 1.5;
  color: var(--ink-2); margin-top: 12px;
}
@media (max-width: 720px) {
  .growth-eq { grid-template-columns: 1fr; }
  .growth-eq-op { font-size: 26px; }
}

/* --- Growth: three protest surges --- */
.growth-surges-wrap { margin-top: 22px; }
.growth-surges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.growth-surge { border: 1px solid var(--ink); border-top: 4px solid var(--red); padding: 16px 16px 14px; background: var(--paper); }
.growth-surge-era { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: var(--red); font-weight: 600; }
.growth-surge-catalyst { font-family: var(--sans); font-weight: 600; font-size: 15px; line-height: 1.25; margin-top: 6px; color: var(--ink); }
.growth-surge-delta { font-family: var(--serif); font-weight: 700; font-size: 30px; line-height: 1; color: var(--red); margin-top: 12px; }
.growth-surge-range { font-family: var(--mono); font-size: 11px; color: var(--ink-3); margin-top: 4px; }
.growth-surges-note { font-family: var(--serif); font-style: italic; font-size: 14px; line-height: 1.5; color: var(--ink-2); margin-top: 12px; }
@media (max-width: 720px) { .growth-surges { grid-template-columns: 1fr; } }

/* --- Growth: surges vs stalls --- */
.growth-ss { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 22px; border: 1px solid var(--ink); }
.growth-ss-col { padding: 18px 20px; }
.growth-ss-col.surge { border-right: 1px solid var(--ink); }
.growth-ss-col.stall { background: var(--paper-2); }
.growth-ss-head { font-family: var(--sans); font-weight: 700; font-size: 15px; letter-spacing: .01em; margin-bottom: 10px; }
.growth-ss-col.surge .growth-ss-head { color: var(--red); }
.growth-ss-col.stall .growth-ss-head { color: var(--ink-3); }
.growth-ss-col ul { margin: 0; padding-left: 18px; }
.growth-ss-col li { font-family: var(--serif); font-size: 14px; line-height: 1.5; color: var(--ink-2); margin-bottom: 8px; }
@media (max-width: 720px) {
  .growth-ss { grid-template-columns: 1fr; }
  .growth-ss-col.surge { border-right: none; border-bottom: 1px solid var(--ink); }
}

/* --- Animated slate hero --- */
.slate-hero { margin: 8px 0 44px; }
.slate-hero-eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--red); margin-bottom: 12px;
}
.slate-hero-stage {
  position: relative; overflow: hidden; border: 1px solid var(--ink); background: #fff; line-height: 0;
}
.slate-hero-stage img { display: block; width: 100%; height: auto; filter: grayscale(1) contrast(1.03); }
.slate-hero-spot {
  position: absolute; top: 0; bottom: 0;
  box-shadow: 0 0 0 2000px rgba(20,16,12,0.60);
  border-left: 2px solid var(--red); border-right: 2px solid var(--red);
  transition: left .55s cubic-bezier(.4,.05,.2,1), width .55s ease;
  pointer-events: none; z-index: 1;
}
.slate-hero-names {
  display: flex; margin-top: 12px; border: 1px solid var(--rule); border-bottom: none;
}
.slate-hero-namecell {
  border: none; border-bottom: 3px solid transparent; border-right: 1px solid var(--rule);
  background: var(--paper); cursor: pointer; padding: 12px 8px;
  font-family: var(--sans); font-weight: 600; font-size: 13px; line-height: 1.25; color: var(--ink-3);
  text-align: center; transition: color .3s ease, background .3s ease, border-color .3s ease;
}
.slate-hero-namecell:last-child { border-right: none; }
.slate-hero-namecell.active { color: var(--paper); background: var(--red); border-bottom-color: var(--ink); }
.slate-hero-namecell:hover { color: var(--ink); }
.slate-hero-namecell.active:hover { color: var(--paper); }
@media (max-width: 720px) {
  .slate-hero-namecell { font-size: 10px; padding: 9px 4px; }
}
/* Embeds */
.ndsa-embed-map { margin-top: 16px; }
.ndsa-embed-map > iframe { width: 100%; height: 1040px; }
.ndsa-video-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 16px;
}
.ndsa-video {
  position: relative; width: 100%; padding-top: 56.25%;
  border: 1px solid var(--ink); background: var(--ink); box-shadow: var(--shadow-hard);
}
.ndsa-video > iframe {
  position: absolute; inset: 0; width: 100%; height: 100%; border: none; display: block;
}

@media (max-width: 900px) {
  .ndsa-stats { grid-template-columns: repeat(2, 1fr); }
  .ndsa-stat:nth-child(2n) { border-right: none; }
  .ndsa-roster-grid { grid-template-columns: repeat(2, 1fr); }
  .ndsa-npc:nth-child(4n) { border-right: 1px solid var(--rule); }
  .ndsa-npc:nth-child(2n) { border-right: none; }
  .ndsa-caucus-grid { grid-template-columns: 1fr; }
  .ndsa-caucus { border-right: none; }
  .ndsa-caucus:nth-child(2) { border-top: 1px solid var(--rule); }
  .ndsa-quotes { grid-template-columns: 1fr; }
  .ndsa-quote { border-right: none; }
  .ndsa-quote:nth-child(2) { border-top: 1px solid var(--rule); }
  .ndsa-video-grid { grid-template-columns: 1fr; }
  .ndsa-embed-map > iframe { height: 720px; }
  .ndsa-modes { grid-template-columns: 1fr; }
  .ndsa-mode { border-right: none; border-top: 1px solid var(--rule); }
  .ndsa-mode:first-child { border-top: none; }
  .ndsa-pull-text { font-size: 20px; }
  .ndsa-diagram { grid-template-columns: 1fr; }
  .ndsa-spectrum-grid { grid-template-columns: repeat(2, 1fr); }
  .ndsa-spectrum-axis { display: none; }
}
@media (max-width: 620px) {
  .ndsa-spectrum-grid { grid-template-columns: 1fr; }
  .ndsa-dia-row { grid-template-columns: 1fr; }
}

@media (max-width: 1100px) {
  .bt-wall-grid, .mq-grid { grid-template-columns: repeat(2, 1fr); }
  .bt-wall-tile:nth-child(3n), .mq-tile:nth-child(3n) { border-right: 1px solid var(--rule); }
  .bt-wall-tile:nth-child(2n), .mq-tile:nth-child(2n) { border-right: none; }
}
@media (max-width: 720px) {
  .bt-wall-grid, .mq-grid { grid-template-columns: 1fr; }
  .bt-wall-tile, .mq-tile { border-right: none !important; }
}
.bt-end .src-bar { border-top-color: rgba(241,233,215,.18); }
.bt-end .src-link {
  background: transparent; color: var(--paper-3); border-color: rgba(241,233,215,.25);
}
.bt-end .src-link:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }

@media (max-width: 1100px) {
  .bt-doors { grid-template-columns: repeat(2, 1fr); }
  .bt-funnel { display: none; }
}
@media (max-width: 900px) {
  .bt-thesis { grid-template-columns: 1fr; gap: 16px; padding: 22px 22px; }
  .bt-end { grid-template-columns: 1fr; gap: 22px; padding: 26px 22px; }
  .bt-end h3 { font-size: 32px; }
}
@media (max-width: 720px) {
  .bt-doors { grid-template-columns: 1fr; }
}

/* ============================================================
   INDOCTRINATION DEEP-DIVE
   ============================================================ */
.indoc { margin-top: 64px; }
.indoc-head {
  display: grid; grid-template-columns: 130px 1fr; gap: 32px; align-items: baseline; margin-bottom: 28px;
}
.indoc-num {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: .18em; color: var(--red);
  text-transform: uppercase;
}
.indoc-num::before { content: "→ "; }
.indoc-title {
  font-family: var(--serif); font-weight: 600; font-size: 32px; line-height: 1.06; letter-spacing: -0.012em;
}
.indoc-sub {
  font-family: var(--serif); font-size: 16.5px; line-height: 1.55; color: var(--ink-2);
  margin-top: 8px; max-width: 820px;
}

/* Pipeline ladder */
.indoc-pipeline {
  border-top: 2px solid var(--ink); border-left: 1px solid var(--ink); border-right: 1px solid var(--ink);
  background: var(--paper);
}
.indoc-stage {
  display: grid; grid-template-columns: 100px 1fr 240px; gap: 28px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--ink);
  align-items: baseline;
  transition: background 200ms;
}
.indoc-stage:hover { background: var(--paper-2); }
.indoc-stage .ix-n {
  font-family: var(--serif); font-weight: 700; font-size: 48px; line-height: 0.9; color: var(--red); letter-spacing: -0.02em;
}
.indoc-stage h4 {
  font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.1; letter-spacing: -0.008em;
  margin: 4px 0 8px;
}
.indoc-stage .ix-body {
  font-family: var(--serif); font-size: 15.5px; line-height: 1.55; color: var(--ink-2);
}
.indoc-stage .ix-receipt {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--paper); background: var(--ink); padding: 8px 12px;
  display: inline-block;
  line-height: 1.4;
  align-self: flex-start;
}

/* Professors grid */
.indoc-profs-head {
  display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: flex-end;
  margin: 56px 0 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ink);
}
.indoc-profs-head .kicker { color: var(--red); }
.indoc-profs-head .right-tag {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase;
  background: var(--ink); color: var(--paper); padding: 6px 12px;
}
.indoc-profs {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 0;
  border: 1px solid var(--ink);
}
.indoc-prof {
  padding: 22px 24px;
  border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  background: var(--paper);
  display: flex; flex-direction: column; gap: 10px;
}
.indoc-prof:nth-child(2n) { border-right: none; }
.indoc-prof:nth-last-child(-n+2) { border-bottom: none; }
.indoc-prof .ip-name {
  font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.05; letter-spacing: -0.008em;
}
.indoc-prof .ip-role {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .08em; color: var(--red); text-transform: uppercase;
}
.indoc-prof .ip-aff {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.45; color: var(--ink-2);
  padding: 8px 0; border-top: 1px dashed var(--rule); border-bottom: 1px dashed var(--rule);
}
.indoc-prof .ip-quote {
  font-family: var(--serif); font-style: italic; font-size: 15px; line-height: 1.45; color: var(--ink);
}
.indoc-prof .ip-link {
  font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red); text-decoration: none; align-self: flex-start;
}
.indoc-prof .ip-link:hover { text-decoration: underline; }

/* Encampments band */
.indoc-camps {
  margin-top: 48px;
  background: var(--ink); color: var(--paper);
  padding: 32px 36px;
  border: 1px solid var(--ink);
}
.indoc-camps .ic-eyebrow {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red-pale); margin-bottom: 6px;
}
.indoc-camps h4 {
  font-family: var(--serif); font-weight: 600; font-size: 26px; line-height: 1.05; letter-spacing: -0.012em;
  color: var(--paper); margin: 0 0 18px;
}
.indoc-camps ul { margin: 0; padding: 0; list-style: none; }
.indoc-camps li {
  font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: var(--paper);
  padding: 10px 0 10px 22px; position: relative;
  border-bottom: 1px dashed rgba(241,233,215,.18);
}
.indoc-camps li:last-child { border-bottom: none; }
.indoc-camps li::before {
  content: "▸"; position: absolute; left: 0; color: var(--red-pale); font-size: 14px; top: 12px;
}

@media (max-width: 900px) {
  .indoc-stage { grid-template-columns: 1fr; gap: 8px; }
  .indoc-profs { grid-template-columns: 1fr; }
  .indoc-prof { border-right: none; }
  .indoc-head { grid-template-columns: 1fr; gap: 8px; }
  .indoc-camps { padding: 22px 22px; }
}

/* === Indoctrination → Mobilization handoff === */
.handoff {
  margin-top: 64px;
  border: 2px solid var(--ink);
  background: var(--paper);
}
.handoff-head {
  background: var(--paper-2);
  padding: 26px 32px 28px;
  border-bottom: 2px solid var(--ink);
  display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: start;
}
.handoff-arrow-mark {
  font-family: var(--serif); font-size: 96px; font-weight: 700;
  color: var(--red); line-height: 0.8;
}
.handoff-head .eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--red);
  margin-bottom: 6px;
}
.handoff-head h4 {
  font-family: var(--serif); font-weight: 600; font-size: 32px; line-height: 1.05; letter-spacing: -0.014em;
  margin: 0 0 10px;
}
.handoff-head .lede {
  font-family: var(--serif); font-style: italic; font-size: 16.5px; line-height: 1.5; color: var(--ink-2);
  max-width: 720px;
}
.handoff-list { padding: 0; }
.handoff-row {
  display: grid; grid-template-columns: 60px minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); gap: 24px;
  padding: 22px 32px;
  border-bottom: 1px solid var(--rule);
  align-items: start;
  transition: background 180ms;
}
.handoff-row:hover { background: var(--paper-2); }
.handoff-row:last-child { border-bottom: 2px solid var(--ink); }
.handoff-n {
  font-family: var(--serif); font-weight: 700; font-size: 32px; line-height: 0.9; color: var(--red); letter-spacing: -0.02em;
}
.handoff-title {
  font-family: var(--serif); font-weight: 600; font-size: 18px; line-height: 1.2;
}
.handoff-body {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.5; color: var(--ink-2);
}
.handoff-pair { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.handoff-pair .from-to-lbl {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
}
.handoff-pair .from-to-val {
  font-family: var(--mono); font-size: 11px; letter-spacing: .04em; color: var(--ink);
  padding: 4px 8px;
  background: var(--paper-2); border: 1px solid var(--rule);
  align-self: flex-start;
  max-width: 100%; overflow-wrap: anywhere;
}
.handoff-pair.to .from-to-val { background: var(--red); color: var(--paper); border-color: var(--red); }
.handoff-conclusion {
  background: var(--ink); color: var(--paper);
  padding: 22px 32px;
  font-family: var(--serif); font-style: italic; font-size: 17px; line-height: 1.5;
}
.handoff-conclusion::before {
  content: "RESULT";
  display: block;
  font-family: var(--mono); font-style: normal; font-size: 10.5px; letter-spacing: .2em;
  color: var(--red-pale); margin-bottom: 8px;
}

@media (max-width: 900px) {
  .handoff-row { grid-template-columns: 1fr; gap: 10px; }
  .handoff-head { grid-template-columns: 1fr; gap: 8px; }
  .handoff-arrow-mark { font-size: 64px; }
}

/* === Hundreds of Zohrans callout === */
.hz {
  margin-top: 32px;
  background: var(--ink); color: var(--paper);
  border: 1px solid var(--ink);
  padding: 36px 40px;
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; align-items: flex-start;
}
.hz .hz-eyebrow { font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; color: var(--red-pale); text-transform: uppercase; }
.hz h4 {
  font-family: var(--serif); font-weight: 700; font-size: 40px; line-height: 1.0;
  letter-spacing: -0.02em; margin: 6px 0 16px; color: var(--paper);
}
.hz .hz-body {
  font-family: var(--serif); font-size: 16.5px; line-height: 1.55; color: var(--paper-3);
}
.hz .hz-quotes { display: flex; flex-direction: column; gap: 12px; }
.hz .hz-quote {
  background: rgba(241,233,215,.06);
  border-left: 3px solid var(--red);
  padding: 16px 20px;
  font-family: var(--serif); font-style: italic; font-size: 16px; line-height: 1.42;
  color: var(--paper);
}
.hz .hz-quote .qattr {
  font-family: var(--mono); font-style: normal; font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red-pale); margin-top: 12px;
}
.hz .hz-quote .qlink {
  display: inline-block; margin-top: 8px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red-pale); text-decoration: none;
}
.hz .hz-quote .qlink:hover { color: var(--paper); }
.hz .src-bar { border-top-color: rgba(241,233,215,.18); }
.hz .src-link { background: transparent; color: var(--paper-3); border-color: rgba(241,233,215,.25); }
.hz .src-link:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }

/* === WFP history mini-callout === */
/* WFP district color-change progression */
.wfp-prog { margin-top: 20px; background: var(--paper); border: 1px solid var(--ink); padding: 22px 26px; }
.wfp-legend { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 18px; }
.wfp-leg { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.wfp-sw { width: 13px; height: 13px; border: 1px solid var(--ink); display: inline-block; }
.wfp-sw.gray { background: #ada593; }
.wfp-sw.yellow { background: var(--gold); }
.wfp-sw.red { background: var(--red); }
.wfp-stages { display: flex; align-items: stretch; gap: 0; }
.wfp-stage { flex: 1; display: flex; flex-direction: column; }
.wfp-stage-yr { font-family: var(--serif); font-weight: 700; font-size: 22px; color: var(--ink); margin-bottom: 10px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.wfp-stage-tag { font-family: var(--mono); font-size: 9.5px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--red); }
.wfp-names { margin-top: 10px; display: flex; flex-direction: column; gap: 5px; }
.wfp-names > div { font-family: var(--serif); font-size: 12px; line-height: 1.35; color: var(--ink-2); }
.wfp-names-key { font-family: var(--mono); font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--paper); padding: 2px 5px; margin-right: 6px; vertical-align: middle; }
.wfp-names-key.red { background: var(--red); }
.wfp-names-key.gold { background: var(--gold); color: var(--ink); }
.wfp-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.wfp-tile { aspect-ratio: 1 / 1; border: 1px solid rgba(26,22,18,.18); }
.wfp-tile.gray { background: #ada593; }
.wfp-tile.yellow { background: var(--gold); }
.wfp-tile.red { background: var(--red); }
.wfp-stage-note { font-family: var(--serif); font-size: 13px; line-height: 1.4; color: var(--ink-2); margin-top: 12px; }
.wfp-arrow { align-self: center; color: var(--red); font-size: 26px; padding: 0 16px; flex: none; }
.wfp-callout {
  margin-top: 18px; padding: 12px 16px; border-left: 4px solid var(--red); background: var(--paper-2);
  font-family: var(--serif); font-style: italic; font-size: 15.5px; line-height: 1.45; color: var(--ink);
}
@media (max-width: 720px) {
  .wfp-stages { flex-direction: column; gap: 14px; }
  .wfp-arrow { transform: rotate(90deg); padding: 0; align-self: center; }
}

.wfp-history {
  margin-top: 20px;
  background: var(--paper); border: 1px solid var(--ink);
  padding: 22px 26px;
  display: grid; grid-template-columns: 200px 1fr; gap: 26px; align-items: flex-start;
}
.wfp-history .wfph-label {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red);
  padding-top: 4px;
}
.wfp-history .wfph-quotes { display: flex; flex-direction: column; gap: 14px; }
.wfp-history .wfph-quote {
  font-family: var(--serif); font-style: italic; font-size: 16px; line-height: 1.45; color: var(--ink);
  padding-left: 14px; border-left: 2px solid var(--red);
}
.wfp-history .wfph-quote .qattr {
  font-family: var(--mono); font-style: normal; font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-3); margin-top: 8px;
}
.wfp-history .wfph-quote a {
  display: inline-block; margin-top: 6px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red); text-decoration: none;
}
.wfp-history .wfph-quote a:hover { text-decoration: underline; }

@media (max-width: 900px) {
  .hz { grid-template-columns: 1fr; gap: 22px; padding: 26px 22px; }
  .hz h4 { font-size: 30px; }
  .wfp-history { grid-template-columns: 1fr; gap: 12px; padding: 18px 20px; }
}

/* === Chapter Intro callout (top of "Inside the chapter") === */
.chap-intro {
  display: grid; grid-template-columns: 260px 1fr; gap: 36px; align-items: flex-start;
  background: var(--paper-2); border: 1px solid var(--ink);
  padding: 30px 36px;
  margin-bottom: 36px;
}
.chap-intro .ci-eyebrow {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--red);
}
.chap-intro h4 {
  font-family: var(--serif); font-weight: 600; font-size: 26px; line-height: 1.05;
  letter-spacing: -0.012em; margin: 6px 0 0;
}
.chap-intro .ci-body {
  font-family: var(--serif); font-size: 16.5px; line-height: 1.55; color: var(--ink);
}
.chap-intro ul { margin: 14px 0 0; padding: 0; list-style: none; }
.chap-intro li {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.5; color: var(--ink-2);
  padding: 10px 0 10px 18px; position: relative;
  border-top: 1px dashed var(--rule);
}
.chap-intro li:first-child { border-top: none; }
.chap-intro li::before {
  content: "▸"; position: absolute; left: 0; color: var(--red); font-size: 13px; top: 11px;
}
.chap-intro li strong { color: var(--ink); font-weight: 600; }

@media (max-width: 900px) {
  .chap-intro { grid-template-columns: 1fr; gap: 14px; padding: 22px 22px; }
}

.float-nav {
  position: fixed; top: 14px; left: 50%; transform: translateX(-50%);
  z-index: 50;
  display: flex; align-items: stretch;
  background: var(--ink); color: var(--paper);
  border: 1px solid var(--ink);
  box-shadow: 0 6px 22px rgba(26,22,18,.18), 0 2px 6px rgba(26,22,18,.12);
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  max-width: calc(100vw - 32px);
  opacity: 0; pointer-events: none;
  transition: opacity 220ms ease;
}
.float-nav.visible { opacity: 1; pointer-events: auto; }
.float-nav .fn-brand {
  padding: 10px 14px;
  border-right: 1px solid rgba(241,233,215,.2);
  display: flex; align-items: center; gap: 8px;
  white-space: nowrap;
}
.float-nav .fn-brand .dot { width: 7px; height: 7px; background: var(--red); border-radius: 50%; }
.float-nav .fn-select {
  appearance: none; -webkit-appearance: none;
  background: transparent; color: var(--paper);
  border: none; border-right: 1px solid rgba(241,233,215,.2);
  padding: 10px 32px 10px 14px;
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--paper-3) 50%), linear-gradient(135deg, var(--paper-3) 50%, transparent 50%);
  background-position: calc(100% - 16px) center, calc(100% - 11px) center;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.float-nav .fn-select:hover { background-color: rgba(241,233,215,.05); }
.float-nav .fn-select option { background: var(--ink); color: var(--paper); }
.float-nav .fn-btn {
  background: var(--red); color: var(--paper);
  border: none; padding: 0 16px;
  font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  cursor: pointer;
  display: flex; align-items: center; gap: 8px;
  white-space: nowrap;
}
.float-nav .fn-btn:hover { background: var(--red-deep); }
.float-nav .fn-btn .arrow {
  font-size: 14px;
  font-family: var(--serif);
  font-weight: 700;
}

@media (max-width: 720px) {
  .float-nav { font-size: 10px; letter-spacing: .1em; top: 10px; }
  .float-nav .fn-brand { padding: 9px 11px; }
  .float-nav .fn-select { padding: 9px 28px 9px 11px; max-width: 140px; }
  .float-nav .fn-btn { padding: 0 12px; }
  .float-nav .fn-brand-label { display: none; }
}
.footer-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 48px; }
.footer .h-display { font-size: 36px; }
.footer .small { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }

/* === Stakes === */
.stakes-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.stake { padding: 26px 24px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.stake .big { font-family: var(--serif); font-size: 68px; font-weight: 700; line-height: 0.9; color: var(--red); letter-spacing: -0.02em; }
.stake .lbl { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-top: 8px; }
.stake .note { font-family: var(--serif); font-size: 14.5px; color: var(--ink-2); margin-top: 8px; line-height: 1.4; }

/* === TOC === */
.toc { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); margin: 56px 0 0; }
.toc a {
  display: block; padding: 16px 18px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  text-decoration: none; color: var(--ink); background: var(--paper);
  font-family: var(--serif); font-size: 17px; font-weight: 500;
  transition: background 150ms;
}
.toc a:hover { background: var(--ink); color: var(--paper); }
.toc a .n { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; color: var(--red); display: block; margin-bottom: 4px; }
.toc a:hover .n { color: var(--paper-3); }

/* Pull-quote */
.pull {
  font-family: var(--serif); font-size: 30px; line-height: 1.18; font-weight: 500; color: var(--ink);
  padding: 36px 0 36px 0;
  border-top: 3px solid var(--ink); border-bottom: 1px solid var(--ink);
  margin: 32px 0;
  letter-spacing: -0.008em;
}
.pull cite { display: block; font-family: var(--mono); font-style: normal; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-top: 16px; }

/* Two-column body */
.two-col { columns: 2; column-gap: 48px; column-rule: 1px solid var(--rule); font-family: var(--serif); font-size: 17px; line-height: 1.55; color: var(--ink-2); }
.two-col p { margin: 0 0 16px; break-inside: avoid; }
.two-col p:first-child::first-letter {
  font-family: var(--serif); font-weight: 700; font-size: 64px; line-height: 0.85;
  float: left; padding: 6px 10px 0 0; color: var(--red);
}

/* Responsive */
@media (max-width: 1100px) {
  .machine-grid { grid-template-columns: repeat(2, 1fr); }
  .policy-grid { grid-template-columns: 1fr; }
  .org-grid { grid-template-columns: repeat(2, 1fr); }
  .stakes-grid { grid-template-columns: repeat(2, 1fr); }
  .toc { grid-template-columns: repeat(2, 1fr); }
  .map-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .page { padding: 0 22px; }
  .section { padding: 64px 0; }
  .section-head { grid-template-columns: 1fr; gap: 8px; margin-bottom: 28px; }
  .section-title { font-size: 32px; }
  .findings { grid-template-columns: 1fr; }
  .machine-grid { grid-template-columns: 1fr; }
  .org-grid { grid-template-columns: 1fr; }
  .stakes-grid { grid-template-columns: 1fr; }
  .toc { grid-template-columns: 1fr; }
  .two-col { columns: 1; }
  .dossier-head { grid-template-columns: 64px 1fr; }
  .dossier-photo { width: 64px; height: 82px; }
  .dossier-status { grid-column: 1/-1; text-align: left; margin-top: 8px; }
  .matrix thead th { writing-mode: horizontal-tb; transform: none; height: auto; font-size: 9.5px; }
  .masthead-bottom { grid-template-columns: 1fr 1fr; }
  .mb-cell { padding: 10px; border-bottom: 1px solid var(--rule); }
}

/* ======================================================================
   DASHBOARD
   ====================================================================== */
.dash { padding: 56px 0 80px; }
.dash-masthead { margin-bottom: 32px; }

.dash-bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  padding: 12px 2px; margin-bottom: 22px;
}
.dash-bar-label {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--ink-3);
  display: flex; align-items: center; gap: 10px;
}
.dash-bar-label .dot {
  width: 8px; height: 8px; background: var(--red); border-radius: 50%;
  display: inline-block; flex: none;
}
.dash-readall {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--paper); background: var(--ink);
  border: 1px solid var(--ink); padding: 8px 14px; cursor: pointer;
  transition: background .12s, color .12s;
}
.dash-readall:hover { background: var(--red); border-color: var(--red); }

/* === Grid === */
.dash-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.dw-span-1 { grid-column: span 1; }
.dw-span-2 { grid-column: span 2; }

/* === Widget card === */
.dw {
  background: var(--paper-2); border: 1px solid var(--ink);
  padding: 20px 22px; cursor: pointer; display: flex; flex-direction: column;
  min-height: 218px;
  transition: transform .13s ease, box-shadow .13s ease, background .13s ease;
}
.dw:hover, .dw:focus-visible {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hard);
  background: var(--paper);
  outline: none;
}
.dw-top {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; margin-bottom: 8px;
}
.dw-num {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
  color: var(--red); font-weight: 600;
}
.dw-kicker {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-3);
}
.dw-title {
  font-family: var(--serif); font-weight: 600; font-size: 23px;
  line-height: 1.08; letter-spacing: -.012em; color: var(--ink);
  margin-bottom: 12px;
  /* Reserve two lines so single- and double-line titles push their stat
     numbers to the same baseline across a row. */
  min-height: 2.16em;
}
.dw-span-2 .dw-title { font-size: 27px; }
.dw-body { flex: 1; display: flex; }
.dw-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 16px; padding-top: 10px; border-top: 1px solid var(--rule);
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red);
}
.dw-arrow { transition: transform .13s ease; }
.dw:hover .dw-arrow, .dw:focus-visible .dw-arrow { transform: translateX(5px); }

/* === Widget internals === */
.dw-col { display: flex; flex-direction: column; gap: 12px; width: 100%; }
.dw-stat { display: flex; align-items: baseline; gap: 10px; }
.dw-stat-num {
  font-family: var(--serif); font-weight: 600; font-size: 52px;
  line-height: .9; color: var(--red); letter-spacing: -.02em;
}
.dw-stat-lbl {
  font-family: var(--mono); font-size: 10px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-3); line-height: 1.3;
  max-width: 130px;
}
.dw-statrow { display: flex; gap: 26px; flex-wrap: wrap; }
.dw-statrow .dw-stat-num { font-size: 40px; }
.dw-desc {
  font-family: var(--serif); font-size: 14.5px; line-height: 1.46;
  color: var(--ink-2); margin: 0;
}

.dw-findings { display: flex; gap: 22px; width: 100%; align-items: flex-start; }
.dw-findings .dw-stat { flex: none; flex-direction: column; align-items: flex-start; gap: 4px; }
.dw-flist { margin: 0; padding: 0; list-style: none; counter-reset: none; }
.dw-flist li {
  font-family: var(--serif); font-size: 14px; line-height: 1.4;
  color: var(--ink); padding: 7px 0; border-top: 1px dashed var(--rule);
  display: grid; grid-template-columns: 26px 1fr; gap: 8px;
}
.dw-flist li:first-child { border-top: none; padding-top: 0; }
.dw-fn { font-family: var(--mono); font-size: 11px; color: var(--red); font-weight: 600; }

.dw-vizrow {
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 20px;
  align-items: center; width: 100%;
}
.dw-cycle, .dw-map, .dw-web { width: 100%; height: auto; display: block; }
.dw-map {
  background: var(--paper-3); border: 1px solid var(--rule); padding: 6px;
}

.dw-spark {
  display: flex; align-items: flex-end; gap: 3px; height: 78px; width: 100%;
  border-bottom: 1px solid var(--ink); padding-top: 4px;
}
.dw-bar-wrap { flex: 1; height: 100%; display: flex; align-items: flex-end; }
.dw-bar {
  width: 100%; background: var(--red); min-height: 2px;
  transition: opacity .12s;
}
.dw:hover .dw-bar { opacity: .82; }

.dw-cmp { display: flex; gap: 8px; }
.dw-cmp span {
  font-family: var(--mono); font-size: 12px; letter-spacing: .1em;
  padding: 8px 14px; border: 1px solid var(--ink); color: var(--ink-2);
}
.dw-cmp .dw-cmp-la { background: var(--red); color: var(--paper); border-color: var(--red); }

.dw-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.dw-chip {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-2);
  border: 1px solid var(--rule); padding: 3px 8px; background: var(--paper);
}

.dash-footer {
  margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--ink);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-3);
}

/* === Top navigation bar === */
.topnav {
  position: sticky; top: 0; z-index: 90;
  background: var(--ink); color: var(--paper);
  border-bottom: 2px solid var(--red);
}
.topnav-inner {
  max-width: 1240px; margin: 0 auto; padding: 0 48px;
  height: 56px; display: flex; align-items: center;
  justify-content: space-between; gap: 20px;
}
.tn-brand {
  display: flex; align-items: center; gap: 9px;
  background: none; border: none; cursor: pointer; padding: 0;
  color: var(--paper);
}
.tn-brand .dot {
  width: 8px; height: 8px; background: var(--red); border-radius: 50%;
  display: inline-block; flex: none;
}
.tn-brand-label {
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em;
  text-transform: uppercase;
}
.tn-right { display: flex; align-items: center; gap: 14px; }

.tn-home {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--paper);
  background: none; border: 1px solid rgba(241, 233, 215, .3);
  padding: 8px 13px; cursor: pointer; transition: background .12s, border-color .12s;
}
.tn-home:hover { border-color: var(--paper); }
.tn-home.active { background: var(--red); border-color: var(--red); }
.tn-grid-mark {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
  width: 13px; height: 13px;
}
.tn-grid-mark span { background: currentColor; display: block; }

.tn-jump { position: relative; display: flex; align-items: center; }
.tn-jump-btn {
  display: flex; align-items: center; gap: 9px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--paper);
  background: var(--red); border: 1px solid var(--red);
  padding: 8px 13px; cursor: pointer; white-space: nowrap;
  transition: background var(--t-fast), border-color var(--t-fast);
}
.tn-jump-btn:hover { background: var(--red-deep); border-color: var(--red-deep); }
.tn-caret {
  font-size: 9px; color: var(--paper);
  transition: transform var(--t-base);
}
.tn-jump-btn[aria-expanded="true"] .tn-caret { transform: rotate(180deg); }

.tn-menu {
  position: absolute; top: calc(100% + 6px); right: 0;
  min-width: 280px; max-height: 72vh; overflow-y: auto;
  background: var(--ink);
  border: 1px solid rgba(241, 233, 215, .2);
  box-shadow: 0 14px 40px rgba(26, 22, 18, .5);
  z-index: 95;
  animation: revealIn 0.2s var(--ease-out) backwards;
}
.tn-menu-item {
  display: flex; align-items: baseline; gap: 12px;
  width: 100%; text-align: left;
  background: none; border: none; cursor: pointer;
  padding: 11px 16px;
  border-bottom: 1px solid rgba(241, 233, 215, .07);
  font-family: var(--mono); font-size: 11px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--paper-3);
  transition: background var(--t-fast), color var(--t-fast);
}
.tn-menu-item:last-child { border-bottom: none; }
.tn-menu-item:hover, .tn-menu-item:focus-visible {
  background: rgba(241, 233, 215, .08); color: var(--paper);
}
.tn-menu-item .tmi-num { color: var(--red-pale); flex: none; }
.tn-menu-item.current { color: var(--paper); }
.tn-menu-item.current .tmi-num { color: var(--red); }
.tn-menu-item .tmi-label { flex: 1; }
.tn-menu-item .tmi-mark { color: var(--red); font-size: 7px; flex: none; }

/* === Briefing — one section visible at a time === */
.briefing > .page { display: none; }
.briefing[data-active="findings"]   > #findings,
.briefing[data-active="slate"]      > #slate,
.briefing[data-active="map"]        > #map,
.briefing[data-active="machine"]    > #machine,
.briefing[data-active="coalition"]  > #coalition,
.briefing[data-active="cycle"]      > #cycle,
.briefing[data-active="web"]        > #web,
.briefing[data-active="policy"]     > #policy,
.briefing[data-active="compare"]    > #compare,
.briefing[data-active="stakes"]     > #stakes,
.briefing[data-active="national"]   > #national,
.briefing[data-active="sources"]    > #sources { display: block; }
.briefing > .page > .section { border-top: none; }

/* === Section footer — prev / next === */
.section-foot {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 14px;
  align-items: stretch;
  border-top: 1px solid var(--ink); margin: 0 0 80px;
  padding-top: 22px;
}
.sf-btn {
  display: flex; flex-direction: column; gap: 5px;
  background: var(--paper-2); border: 1px solid var(--ink);
  padding: 16px 20px; cursor: pointer;
  transition: transform .12s, box-shadow .12s, background .12s;
}
.sf-btn.prev { text-align: left; align-items: flex-start; }
.sf-btn.next { text-align: right; align-items: flex-end; }
.sf-btn:hover {
  background: var(--paper); transform: translateY(-3px);
  box-shadow: var(--shadow-hard);
}
.sf-dir {
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red);
}
.sf-label {
  font-family: var(--serif); font-weight: 600; font-size: 19px;
  line-height: 1.1; color: var(--ink);
}
.sf-home {
  align-self: center;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--paper); background: var(--ink);
  border: 1px solid var(--ink); padding: 13px 18px; cursor: pointer;
  transition: background .12s;
}
.sf-home:hover { background: var(--red); border-color: var(--red); }

@media (max-width: 720px) {
  .topnav-inner { padding: 0 20px; }
  .tn-brand-label { display: none; }
  .section-foot { grid-template-columns: 1fr; }
  .sf-btn.next { text-align: left; align-items: flex-start; }
  .sf-home { order: 3; }
}

/* === Dashboard responsive === */
@media (max-width: 1080px) {
  .dash-grid { grid-template-columns: repeat(2, 1fr); }
  .dw-span-1, .dw-span-2 { grid-column: span 1; }
  .dw-span-2 .dw-title { font-size: 23px; }
  .dw-findings { flex-direction: column; gap: 14px; }
  .dw-vizrow { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .dash-grid { grid-template-columns: 1fr; }
  .dash { padding: 32px 0 64px; }
}

/* ======================================================================
   MOTION SYSTEM — staggered entrance animation + reduced-motion
   ====================================================================== */
/* Entrance is purely additive: blocks render visible by default; JS adds
   .anim-in to replay a staggered cascade on each view change. With no
   scripting the content simply shows, unanimated. */
@keyframes revealIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}
.anim-in {
  animation: revealIn 0.55s var(--ease-out) backwards;
  animation-delay: var(--anim-delay, 0ms);
}
/* Below-the-fold blocks: hidden until scrolled into view, then .anim-in fires. */
.reveal-pending { opacity: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Hover-feedback parity — every framed card responds. Connected grid cells
   tint (a lift would tear shared borders); standalone gapped cards lift. */
.machine-step, .policy-card, .priority-card, .conv-cell, .indoc-prof, .stakes-grid .stake {
  transition: background var(--t-fast);
}
.machine-step:hover, .policy-card:hover, .priority-card:hover,
.conv-cell:hover, .indoc-prof:hover, .stakes-grid .stake:hover {
  background: var(--paper-2);
}
.chapter-receipts .stake { transition: filter var(--t-fast); }
.chapter-receipts .stake:hover { filter: brightness(1.2); }
.org-card { transition: transform 180ms var(--ease-out), box-shadow 180ms var(--ease-out); }
.org-card:hover { transform: translateY(-3px); box-shadow: 3px 3px 0 var(--ink); }

/* ======================================================================
   ACCESSIBILITY — visible keyboard focus
   ====================================================================== */
:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 2px;
}
:focus:not(:focus-visible) {
  outline: none;
}
/* On dark surfaces a red ring is low-contrast — use a paper-colored ring */
.topnav :focus-visible { outline-color: var(--paper); }

/* ======================================================================
   SEARCH — command palette
   ====================================================================== */
.tn-search {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--paper);
  background: none; border: 1px solid rgba(241, 233, 215, .3);
  padding: 8px 11px; cursor: pointer;
  transition: border-color var(--t-fast), background var(--t-fast);
}
.tn-search:hover { border-color: var(--paper); background: rgba(241, 233, 215, .06); }
.tn-search-ico { font-size: 13px; }
.tn-search-kbd {
  font-family: var(--mono); font-size: 9px; letter-spacing: .04em;
  border: 1px solid rgba(241, 233, 215, .3); padding: 1px 5px;
  color: var(--paper-3);
}
.tn-help {
  display: flex; align-items: center; justify-content: center;
  width: 33px; height: 33px; flex: none;
  font-family: var(--serif); font-weight: 600; font-size: 15px;
  color: var(--paper); background: none; border: 1px solid rgba(241, 233, 215, .3);
  cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast);
}
.tn-help:hover { border-color: var(--paper); background: rgba(241, 233, 215, .06); }

/* ---- First-visit guided tour ---- */
.tour-veil { position: fixed; inset: 0; z-index: 99000; }
.tour-veil.solid { background: rgba(20, 16, 12, 0.76); }
.tour-spot {
  position: fixed; z-index: 99001; pointer-events: none;
  border: 2px solid var(--red); border-radius: 4px;
  box-shadow: 0 0 0 9999px rgba(20, 16, 12, 0.76);
}
@keyframes tourTipIn { from { opacity: 0; } }
.tour-tip {
  position: fixed; z-index: 99002; width: 344px; max-width: calc(100vw - 32px);
  background: var(--paper); border: 2px solid var(--ink);
  box-shadow: 6px 6px 0 var(--red);
  padding: 22px 22px 18px;
  animation: tourTipIn .25s var(--ease-out) backwards;
}
.tour-tip-center { top: 50%; left: 50%; transform: translate(-50%, -50%); }
.tour-step {
  font-family: var(--mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--red); margin-bottom: 8px;
}
.tour-title {
  font-family: var(--serif); font-weight: 600; font-size: 21px; line-height: 1.16;
  letter-spacing: -0.012em; color: var(--ink); margin-bottom: 8px;
}
.tour-body {
  font-family: var(--serif); font-size: 15px; line-height: 1.52; color: var(--ink-2);
  margin-bottom: 18px;
}
.tour-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tour-nav { display: flex; gap: 8px; }
.tour-skip {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase;
  background: none; border: none; color: var(--ink-3); cursor: pointer; padding: 6px 0;
}
.tour-skip:hover { color: var(--ink); }
.tour-btn {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
  background: var(--ink); color: var(--paper); border: 1px solid var(--ink);
  padding: 9px 15px; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast);
}
.tour-btn:hover { background: var(--red); border-color: var(--red); }
.tour-btn.ghost { background: transparent; color: var(--ink); }
.tour-btn.ghost:hover { background: var(--paper-2); color: var(--ink); border-color: var(--ink); }

.search-scrim {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(26, 22, 18, .55);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 11vh 24px 24px;
  animation: searchFade .14s ease;
}
@keyframes searchFade { from { opacity: 0; } to { opacity: 1; } }
.search-box {
  width: 100%; max-width: 640px; max-height: 74vh;
  display: flex; flex-direction: column;
  background: var(--paper); border: 2px solid var(--ink);
  box-shadow: 0 24px 64px rgba(26, 22, 18, .5);
  animation: revealIn .22s var(--ease-out) backwards;
}
.search-input-row {
  display: flex; align-items: center; gap: 12px;
  padding: 15px 18px;
  background: var(--paper-2); border-bottom: 2px solid var(--ink);
}
.search-ico { font-size: 19px; color: var(--red); line-height: 1; flex: none; }
.search-input {
  flex: 1; min-width: 0;
  border: none; background: none; outline: none;
  font-family: var(--serif); font-size: 19px; color: var(--ink);
}
.search-input::placeholder { color: var(--ink-3); font-style: italic; }
.search-kbd {
  flex: none;
  font-family: var(--mono); font-size: 9px; letter-spacing: .08em;
  border: 1px solid var(--rule); padding: 2px 6px; color: var(--ink-3);
}
.search-results { overflow-y: auto; }
.search-note {
  padding: 22px 20px;
  font-family: var(--serif); font-style: italic; font-size: 15px;
  line-height: 1.5; color: var(--ink-3);
}
.search-result {
  display: grid; grid-template-columns: 92px 1fr; gap: 2px 14px;
  width: 100%; text-align: left;
  background: none; border: none;
  border-bottom: 1px solid var(--rule);
  padding: 11px 18px; cursor: pointer;
  transition: background var(--t-fast);
}
.search-result:last-child { border-bottom: none; }
.search-result.sel { background: var(--paper-2); }
.search-result .sr-type {
  grid-row: span 2; align-self: center;
  font-family: var(--mono); font-size: 9px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--red);
}
.search-result .sr-label {
  min-width: 0;
  font-family: var(--serif); font-size: 16px; line-height: 1.25; color: var(--ink);
}
.search-result .sr-sub {
  min-width: 0;
  font-family: var(--mono); font-size: 10px; letter-spacing: .03em; color: var(--ink-3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

@keyframes searchPulse {
  0%   { opacity: 0; }
  10%  { opacity: 1; }
  68%  { opacity: 1; }
  100% { opacity: 0; }
}
.search-hit { position: relative; z-index: 3; }
.search-hit::after {
  content: ""; position: absolute; inset: -2px;
  pointer-events: none; z-index: 6;
  box-shadow: 0 0 0 3px var(--red);
  animation: searchPulse 2.4s var(--ease-out) forwards;
}

@media (max-width: 720px) {
  .tn-search-label, .tn-search-kbd { display: none; }
}

/* ======================================================================
   §08 ENDORSEMENT WEB — gamified "trace the network" prototype
   ====================================================================== */
.ew-hud {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  background: var(--ink); color: var(--paper);
  padding: 14px 18px;
}
.ew-hud-track { flex: 1; min-width: 220px; }
.ew-hud-label {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--red-pale); margin-bottom: 7px;
}
.ew-bar { height: 8px; background: rgba(241, 233, 215, .14); }
.ew-bar-fill { height: 100%; background: var(--red); transition: width .5s var(--ease-out); }
.ew-hud-stat { font-family: var(--mono); font-size: 11px; letter-spacing: .06em; color: var(--paper-3); }
.ew-hud-stat b { color: var(--paper); font-size: 14px; }
.ew-hud-btn {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  background: var(--red); color: var(--paper); border: none;
  padding: 8px 13px; cursor: pointer; transition: background var(--t-fast);
}
.ew-hud-btn:hover { background: var(--red-deep); }
.ew-hud-done {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--red-pale);
}
.ew-coach {
  display: flex; align-items: center; gap: 16px;
  background: var(--paper-2);
  border-bottom: 1px solid var(--ink); border-left: 4px solid var(--red);
  padding: 12px 16px;
}
.ew-coach-step { flex: 1; font-family: var(--serif); font-size: 14.5px; line-height: 1.45; color: var(--ink); }
.ew-legend {
  display: flex; flex-wrap: wrap; gap: 10px 24px; align-items: center;
  padding: 10px 16px; border-bottom: 1px solid var(--rule); background: var(--paper);
}
.ew-legend-item {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .04em; color: var(--ink-2);
}
.ew-legend-item svg { flex: none; }
.ew-coach-x {
  flex: none;
  font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  background: var(--ink); color: var(--paper); border: none;
  padding: 7px 12px; cursor: pointer;
}
.ew-edge {
  stroke-dasharray: 1400; stroke-dashoffset: 1400;
  animation: ewDraw .7s var(--ease-out) forwards;
}
@keyframes ewDraw { to { stroke-dashoffset: 0; } }
.ew-edge-rec { stroke-dasharray: 7 5 !important; stroke-dashoffset: 0 !important; animation: none !important; }
.ew-badge {
  position: fixed; right: 24px; bottom: 24px; z-index: 120;
  display: flex; align-items: center; gap: 14px;
  background: var(--ink); color: var(--paper); border: 1px solid var(--red);
  padding: 16px 20px; max-width: 340px;
  box-shadow: 0 16px 40px rgba(26, 22, 18, .5);
  animation: ewBadgeIn .42s var(--ease-out) backwards;
}
@keyframes ewBadgeIn { from { opacity: 0; transform: translateY(18px) scale(.96); } }
.ew-badge-star { font-size: 26px; color: var(--gold); line-height: 1; flex: none; }
.ew-badge-title { font-family: var(--serif); font-weight: 600; font-size: 17px; color: var(--paper); }
.ew-badge-desc {
  font-family: var(--mono); font-size: 10px; letter-spacing: .03em; color: var(--paper-3);
  margin-top: 3px; line-height: 1.4;
}

/* §02 Slate audit — reviewed-dossier marker */
.dossier { transition: border-color 200ms var(--ease-out); }
.dossier.reviewed { border-color: var(--ink); }
.dossier-reviewed {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--red); margin-top: 7px;
}

/* ==================================================================
   Mobile fixes (≤720px) — comprehensive responsive pass
   ================================================================== */
@media (max-width: 720px) {
  /* Top nav: allow wrapping; tighten sizes; let buttons shrink */
  .topnav { flex-wrap: wrap; row-gap: 6px; padding: 8px 10px; }
  .topnav .tn-brand, .topnav .tn-search, .topnav .tn-home, .topnav .tn-help, .topnav .tn-jump-btn {
    font-size: 11px !important; padding: 6px 10px !important; letter-spacing: .08em !important;
  }
  .tn-brand-label { display: none; }
  .tn-search-kbd { display: none; }
  .tn-jump-btn { max-width: 60vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* Dashboard masthead: stack meta vertically; tighten title */
  .masthead, .dash-masthead { padding: 18px 14px !important; }
  .masthead-top { flex-direction: column; align-items: flex-start; gap: 8px; }
  .masthead-mark { font-size: 18px !important; }
  .masthead-meta { flex-direction: column; align-items: flex-start; gap: 4px; }
  .masthead-meta span { font-size: 10.5px; }

  /* Dashboard grid: every widget full-width regardless of span */
  .dash-grid { grid-template-columns: 1fr !important; }
  .dw, .dw-span-2, .dw-span-3, .dw-span-4 { grid-column: 1 / -1 !important; }

  /* Section heads: stack the §-num and the title */
  .section-head { grid-template-columns: 1fr !important; gap: 12px !important; }
  .section-num { font-size: 11px; }
  .section-title { font-size: 30px !important; line-height: 1.05 !important; }
  .section-sub { font-size: 14.5px !important; }

  /* Pull quotes / hero typography */
  .pull { font-size: 20px !important; line-height: 1.25 !important; padding: 16px !important; }
  .h-display { font-size: 26px !important; line-height: 1.1 !important; }
  .h3 { font-size: 20px !important; }

  /* Body prose */
  .body { font-size: 15.5px !important; line-height: 1.5 !important; }

  /* Footer grid → single column */
  .footer-grid { grid-template-columns: 1fr !important; gap: 24px !important; }
  .footer { padding: 24px 16px !important; }

  /* Page padding: tighter on mobile */
  .page { padding: 16px 14px !important; }
  .section { padding: 0 !important; }

  /* Endorsement web SVG: keep horizontal scroll instead of letterboxing */
  .endorse-web-stage { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .endorse-web-stage svg { min-width: 720px; }
  .endorse-web-toolbar { flex-wrap: wrap; gap: 8px; }

  /* Coalition matrix table: horizontal scroll */
  .matrix-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Machine flow / NY-Philly compare / generic 3- and 2-col grids → 1 col */
  .machine-grid, .cmp, .priority-grid, .ndsa-modes, .ndsa-roster-grid, .ndsa-cochairs,
  .org-extended-grid, .npc-layout, .indoc-camps, .conv-grid, .handoff-grid,
  .stake-grid, .dossier-extras, .ndsa-stats, .lac-block .ndsa-stats { grid-template-columns: 1fr !important; }

  /* WFP progression tiles */
  .wfp-stages { grid-template-columns: 1fr !important; }
  .wfp-tiles { grid-template-columns: 1fr 1fr !important; gap: 6px !important; }

  /* Arms-embargo continuum (already 2-col by existing media, but extra safety) */
  .aes-strip { grid-template-columns: 1fr !important; }
  .aes-rail { grid-template-columns: 1fr !important; gap: 8px !important; text-align: center; }

  /* Slate hero: smaller image strip; let names wrap onto two rows of three */
  .slate-hero-names { flex-wrap: wrap; }
  .slate-hero-namecell { width: 33.333% !important; font-size: 10.5px !important; padding: 8px 4px !important; }

  /* Yemen receipts grid (zn-grid) — already collapses; tighten thumb height */
  .img-pop-thumb img { height: 110px; }

  /* Modal scrim padding tighter */
  .org-modal-scrim, .img-pop-scrim { padding: 3vh 8px 8px !important; }
  .org-modal-head { padding: 18px 16px 14px !important; }
  .org-modal-head .om-name { font-size: 22px !important; }
  .org-modal-body { padding: 12px 16px 18px !important; }
  .org-modal-body .om-row { grid-template-columns: 1fr !important; gap: 4px !important; padding: 12px 0 !important; }

  /* NPC roster: rows + tabs scroll horizontally if needed */
  .npc-list { overflow-x: auto; }
  .npc-tabs-row { flex-wrap: wrap; }

  /* PYM interactive timeline: stack rail */
  .ndsa-pym-rail { flex-direction: column; align-items: stretch !important; gap: 6px !important; }
  .ndsa-pym-node { flex-direction: row !important; gap: 10px; }

  /* Tableau chapter map iframe: shorter on mobile */
  .ndsa-embed-map iframe { height: 620px !important; }

  /* Structure diagram boxes: stack */
  .ndsa-dia, .ndsa-dia-row { grid-template-columns: 1fr !important; flex-direction: column !important; }

  /* The growth-eq stat row in LAC block */
  .lac-block .ndsa-stats { gap: 8px !important; }
  .lac-block .ndsa-stat-num { font-size: 28px !important; }

  /* Spectrum / continuum gradient bar end labels */
  .aes-rail-end { font-size: 10px !important; }

  /* General overflow safety */
  body { overflow-x: hidden; }
  img, iframe, svg, table { max-width: 100%; }
}

/* Very narrow phones (≤400px): extra tightening */
@media (max-width: 400px) {
  .topnav { padding: 6px 8px; }
  .topnav button { padding: 5px 8px !important; font-size: 10.5px !important; }
  .section-title { font-size: 26px !important; }
  .h-display { font-size: 22px !important; }
  .slate-hero-namecell { font-size: 10px !important; }
  .ndsa-stat-num { font-size: 24px !important; }
}

/* "How to read this diagram" coach grid (was inline-styled) */
.ew-coach-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
@media (max-width: 1024px) { .ew-coach-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .ew-coach-grid { grid-template-columns: 1fr; } }

/* ==================================================================
   Tablet fixes (≤1024px) — collapse 4-col grids and dossier layout
   ================================================================== */
@media (max-width: 1024px) {
  /* 4-col grids → 2-col at tablet widths */
  .chapter-receipts, .stakes-grid, .toc, .wfp-tiles,
  .ndsa-stats, .lac-block .ndsa-stats { grid-template-columns: repeat(2, 1fr) !important; }

  /* WFP stages: stack at tablet so each year's tiles fit */
  .wfp-stages { flex-direction: column; gap: 18px; }

  /* Dossier head: collapse to 2-col earlier so the FILE/NAME badge doesn't overflow */
  .dossier-head { grid-template-columns: 72px 1fr !important; gap: 18px !important; padding: 18px !important; }
  .dossier-side, .dossier-side > * { max-width: 100%; overflow: hidden; }
  .dossier-file-label, .dossier-side .file-lbl { font-size: 9px !important; letter-spacing: .1em !important; }

  /* Endorse-web toolbar wraps */
  .endorse-web-toolbar { flex-wrap: wrap; gap: 10px; }

  /* Compare NY/Philly cards stack at tablet */
  .cmp { grid-template-columns: 1fr !important; }

  /* Section head: relax the two-col layout into a tighter stack */
  .section-head { gap: 14px; }

  /* Page padding tighter on tablet */
  .page { padding: 28px 22px !important; }

  /* Top nav: drop the brand-label sooner so the section-jump fits */
  .tn-brand-label { font-size: 10px; letter-spacing: .08em; }
}

/* WFP sidebar grid (was inline-styled) */
.wfp-sidebar-grid { display: grid; grid-template-columns: 220px 1fr; gap: 32px; align-items: baseline; }
@media (max-width: 900px) { .wfp-sidebar-grid { grid-template-columns: 1fr; gap: 16px; } }

/* Mobile-specific overrides for elements that don't collapse cleanly */
@media (max-width: 720px) {
  /* WFP tiles: don't go square on tiny screens (they balloon to half the viewport) */
  .wfp-tile { aspect-ratio: auto; height: 38px; }
  .wfp-stage { padding: 14px 12px !important; }

  /* Coalition matrix: keep first column readable; allow horizontal scroll */
  .matrix { min-width: 640px; }
  .matrix th:first-child, .matrix td:first-child { min-width: 180px; text-align: left; }

  /* CA WFP sidebar: collapse + tighten the title */
  .wfp-sidebar-grid .h3 { font-size: 22px !important; line-height: 1.1 !important; }

  /* Anything still rendered as an inline two-column grid should fall back to one */
  [style*="gridTemplateColumns"][style*="1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] { display: block !important; }

  /* The §02 slate "two-col" notable-adjacency block */
  .page#slate [style*="repeat(2, 1fr)"],
  .page#slate [style*="1fr 1fr"] { grid-template-columns: 1fr !important; display: grid !important; }
}

/* ==================================================================
   Global mobile overflow guard — catch every inline-styled grid
   ================================================================== */
@media (max-width: 720px) {
  /* Force every inline-styled grid (gridTemplateColumns="...") to 1 column.
     CSS !important wins over inline-property declarations. */
  .page [style*="grid-template-columns"],
  .page [style*="gridTemplateColumns"],
  .dash [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* Inline 2- and 3-col flex rows in JSX → wrap to single column */
  .page [style*="display: flex"][style*="gap"]:not(.no-stack-mobile) {
    flex-wrap: wrap;
  }

  /* Last-resort viewport guard */
  html, body { max-width: 100vw; overflow-x: hidden; }
  .page, .dash, section { max-width: 100% !important; }

  /* All SVGs/iframes/images obey container width unless explicitly opted-out (the
     endorsement web SVG keeps its min-width and scrolls inside its wrapper). */
  svg:not(.endorse-web-stage svg):not(.no-shrink),
  iframe:not(.no-shrink),
  img:not(.no-shrink) { max-width: 100% !important; height: auto; }

  /* Stat-row inline grids (e.g., the LA Council 4-up) → 2-col instead of 1
     so two stats sit side by side on a phone, not stretched to full width */
  .lac-block [style*="grid-template-columns"],
  .lac-block [style*="gridTemplateColumns"] { grid-template-columns: 1fr 1fr !important; }
}

/* NY/Philly compare table — scroll horizontally on mobile */
.cmp-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 720px) {
  .cmp { min-width: 560px; font-size: 13px; }
  .cmp th, .cmp td { padding: 10px 8px !important; }
}

/* Ensure top-nav right group wraps and shrinks at very narrow widths (≤400px) */
@media (max-width: 400px) {
  .tn-right { flex-wrap: wrap; gap: 6px; min-width: 0; }
  .tn-right > * { flex-shrink: 1; min-width: 0; }
  .tn-search-label { display: none; }
  .topnav .tn-search, .topnav .tn-home, .topnav .tn-help { padding: 5px 8px !important; font-size: 10px !important; }
  .tn-jump-btn { max-width: 70vw; font-size: 10px !important; padding: 5px 8px !important; }
}
