/* ============================================================================
 * news.css — shared styles for the "news-board from the future": the media
 * landing, the scenario article pages, and the sector/country/asset hubs.
 * Financial-media DNA: serif headlines, tight grid, restrained colour, the same
 * design tokens the shared renderers (scenario-view.js, crowd.js) expect.
 * ========================================================================== */
/* "paper terminal" — warm editorial ground, one blue accent, green/red only for
   direction (FT/Semafor/WSJ lineage). Dark strips (market ticker, sins ledger)
   keep their own always-dark tokens. */
:root {
  --bg:#F7F4EC; --surface:#FFFFFF; --surface-2:#F0ECE1; --border:#E2DCCF;
  --text:#1C1A17; --text-2:#6B655B; --text-3:#938B7D;
  --accent:#1A4FB4; --green:#1F7A3D; --red:#B42318; --amber:#B7791F; --gold:#B7791F;
  --signal:#E8A33D;
  --green-bg:rgba(31,122,61,.10); --red-bg:rgba(180,35,24,.10);
  --amber-bg:rgba(183,121,31,.12); --accent-bg:rgba(26,79,180,.10);
  --ink:#0E0D0B; --on-ink:#F2EFE6; --on-ink-mute:#9b958a; --breaking-red:#C8102E;   /* always-dark strips + always-strong breaking red */
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"SF Mono",ui-monospace,"IBM Plex Mono",Menlo,monospace;
  --maxw:1240px;
  --mgwm-land:#E8E1D1; --mgwm-stroke:#D8D0BD;   /* world-map no-data land — paper/light */
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#0d0c0a; --surface:#16140f; --surface-2:#1d1a14; --border:#2c281f;
    --text:#F2EFE6; --text-2:#a59f93; --text-3:#766f62;
    --accent:#6f9bff; --green:#5DCAA5; --red:#F09595; --amber:#E8A33D; --gold:#E8A33D;
    --green-bg:rgba(93,202,165,.13); --red-bg:rgba(240,149,149,.13); --accent-bg:rgba(111,155,255,.14);
    --ink:#000; --on-ink:#F2EFE6; --mgwm-land:#1d1a14; --mgwm-stroke:#2c281f; }
}
.worldmap-sec { margin:26px 0 10px; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.6 var(--sans);
  font-feature-settings:"kern" 1; text-rendering:optimizeLegibility; }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
h1,h2,h3 { font-family:var(--serif); font-weight:600; letter-spacing:-.01em; line-height:1.18; }
.muted { color:var(--text-3); } .small { font-size:13px; }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 22px; }

/* ── top bar ── */
.topbar { display:flex; align-items:center; gap:18px; border-bottom:1px solid var(--border);
  padding:12px 22px; position:sticky; top:0; background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:saturate(160%) blur(8px); z-index:50; }
.topbar .brand { font-family:var(--serif); font-weight:700; font-size:20px; color:var(--text); letter-spacing:-.02em; }
.topbar .navlinks { margin-left:auto; display:flex; gap:16px; font-size:13.5px; }
.topbar .navlinks a { color:var(--text-2); } .topbar .navlinks a:hover { color:var(--text); text-decoration:none; }

/* ── ticker ── */
.ticker { border-bottom:1px solid var(--border); background:var(--surface); overflow:hidden; white-space:nowrap; }
.ticker .track { display:inline-flex; gap:30px; padding:7px 0; animation:tick 80s linear infinite; }
.ticker:hover .track { animation-play-state:paused; }
@keyframes tick { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.ticker .t { font-size:12.5px; color:var(--text-2); font-variant-numeric:tabular-nums; }
.ticker .t b { color:var(--text); } .ticker .t .up{color:var(--green)} .ticker .t .down{color:var(--red)}
.ticker .t .pp { color:var(--gold); font-weight:600; }

/* ── breadcrumbs ── */
.crumbs { font-size:13px; color:var(--text-3); padding:16px 0 4px; } .crumbs a { color:var(--text-2); }
.crumbs span { color:var(--text-3); }

/* ============================ LANDING ============================ */
.hero { display:grid; grid-template-columns:1.6fr 1fr; gap:30px; padding:26px 0 30px; border-bottom:1px solid var(--border); }
@media (max-width:880px){ .hero{ grid-template-columns:1fr; } }
.hero .eyebrow { font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:var(--accent); font-weight:700; }
.hero h1 { font-size:clamp(30px,4.5vw,46px); margin:8px 0 10px; }
.hero .dek { font-size:17px; color:var(--text-2); line-height:1.5; max-width:46ch; }
.hero .lede-card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:18px; align-self:start; }
.reading { font-family:var(--serif); font-size:15px; line-height:1.6; color:var(--text); }
.reading .rsign { font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:var(--gold); font-weight:700; font-family:var(--sans); display:block; margin-bottom:6px; }

.section-h { font-family:var(--serif); font-size:13px; text-transform:uppercase; letter-spacing:.12em; color:var(--text-3);
  border-bottom:2px solid var(--text); display:inline-block; padding-bottom:4px; margin:28px 0 14px; font-weight:700; }
:root .section-h { border-color:var(--accent); }
.controls { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:6px 0 14px; }
.controls select, .controls input { background:var(--surface); border:1px solid var(--border); border-radius:8px;
  color:var(--text); padding:8px 11px; font:13.5px var(--sans); }

/* river of headline scenarios */
.river { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
@media (max-width:880px){ .river{ grid-template-columns:1fr; } }
.river .lead { grid-column:1/3; grid-row:1/3; } @media (max-width:880px){ .river .lead{ grid-column:auto; grid-row:auto; } }

/* scenario card (shared: landing river, hubs) */
.scard { display:block; background:var(--surface); padding:15px 16px; color:var(--text); position:relative; transition:background .12s; }
.scard:hover { background:var(--surface-2); text-decoration:none; }
.scards { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.sc-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.sc-prob { font-family:var(--mono); font-weight:700; font-size:18px; }
.sc-prob.hi{color:var(--green)} .sc-prob.mid{color:var(--gold)} .sc-prob.lo{color:var(--text-2)}
.sc-sin { font-size:14px; opacity:.85; }
.sc-title { font-family:var(--serif); font-size:17px; font-weight:600; line-height:1.28; }
.sc-title a { color:var(--text); } .sc-title a:hover { color:var(--accent); text-decoration:none; }
.sc-lead .sc-title { font-size:30px; line-height:1.12; } .sc-lead .sc-title a:hover{ color:var(--accent); }
.sc-lead { padding:22px 24px; } .sc-lead .why { font-family:var(--serif); font-size:17px; color:var(--text-2); line-height:1.5; margin:10px 0 14px; }
.sc-readmore { display:inline-block; margin-top:10px; font:600 13px var(--sans); }
.sc-meta { font-size:11.5px; margin-top:7px; text-transform:capitalize; }
.sc-impact { font-size:13px; color:var(--text-2); margin-top:8px; line-height:1.45; }
.sc-crowd { margin-top:9px; }

/* ============================ ARTICLE ============================ */
body.article .wrap, body.hub .wrap { max-width:840px; }
article { padding:6px 0 50px; }
.kicker { display:flex; gap:10px; align-items:center; font-size:12px; margin:10px 0 8px; flex-wrap:wrap; }
.kicker .sec { color:var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:11px; }
.kicker .sin { background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:1px 9px; font-size:11.5px; color:var(--text-2); }
article h1 { font-size:clamp(27px,4vw,38px); margin:4px 0 12px; }
.standfirst { font-family:var(--serif); font-size:19px; line-height:1.5; color:var(--text-2); margin:0 0 20px; }
article h2 { font-size:21px; margin:28px 0 10px; padding-top:6px; }
article p { margin:0 0 12px; } article section { margin-bottom:6px; }

.oddsbar { display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center; background:var(--surface);
  border:1px solid var(--border); border-radius:14px; padding:16px 18px; margin:6px 0 22px; }
@media (max-width:560px){ .oddsbar{ grid-template-columns:1fr; } }
.gauge { display:flex; align-items:center; gap:12px; }
.g-pct { font-family:var(--mono); font-size:42px; font-weight:700; color:var(--gold); line-height:1; }
.g-pct span { font-size:20px; } .g-lbl { font-size:12.5px; color:var(--text-2); line-height:1.35; }
.crowdbox { border-left:1px solid var(--border); padding-left:16px; min-height:52px; }
@media (max-width:560px){ .crowdbox{ border-left:none; border-top:1px solid var(--border); padding:12px 0 0; } }
.cb-lbl { font-size:12px; color:var(--text-3); margin-bottom:6px; text-transform:uppercase; letter-spacing:.05em; }
.cb-slot { min-height:26px; display:flex; align-items:center; }

table.mk { width:100%; border-collapse:collapse; font-size:14px; margin:8px 0 14px; }
table.mk th { text-align:left; font:600 11px var(--sans); text-transform:uppercase; letter-spacing:.05em; color:var(--text-3); padding:7px 8px; border-bottom:1px solid var(--border); }
table.mk td { padding:8px; border-bottom:1px solid var(--border); vertical-align:middle; }
table.mk .tk { color:var(--text-3); font-size:11px; font-family:var(--mono); margin-left:5px; }
table.mk .mv { font-family:var(--mono); font-weight:600; } .mv.up{color:var(--green)} .mv.down{color:var(--red)} .mv.flat{color:var(--text-3)}
.hlbadge { font-size:10px; background:var(--accent-bg); color:var(--accent); border-radius:4px; padding:1px 6px; margin-left:7px; font-weight:700; }

.cta-row { display:flex; gap:10px; flex-wrap:wrap; margin:14px 0 4px; }
.cta { display:inline-flex; align-items:center; gap:6px; border-radius:9px; padding:9px 15px; font-weight:700; font-size:13.5px; border:1px solid var(--border); }
.cta:hover { text-decoration:none; filter:brightness(1.08); }
.cta.poly { background:#1652f0; color:#fff; border-color:#1652f0; }
.cta.kalshi { background:#00d09c; color:#04231b; border-color:#00d09c; }
.cta.hl { background:var(--accent); color:#fff; border-color:var(--accent); }

.analogues { margin:6px 0 14px; padding-left:18px; } .analogues li { margin:4px 0; color:var(--text-2); }
.analogues a { color:var(--text); }
.mindmap-wrap { overflow-x:auto; background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:6px; min-height:120px; }
aside.related { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:14px 18px; margin:24px 0; }
aside.related h2 { font-size:15px; margin:0 0 8px; }
ul.rel { list-style:none; margin:0; padding:0; columns:2; } @media(max-width:560px){ ul.rel{columns:1;} }
ul.rel li { margin:4px 0; break-inside:avoid; font-size:14px; }
.hublinks { font-size:13px; color:var(--text-2); margin:18px 0; padding:12px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.method { font-size:12.5px; color:var(--text-3); line-height:1.6; margin-top:22px; }
.method .disc { font-style:italic; margin-top:6px; }

/* ============================ HUB ============================ */
.hubhead { padding:14px 0 18px; border-bottom:1px solid var(--border); margin-bottom:18px; }
.hubhead h1 { font-size:clamp(26px,4vw,36px); margin:6px 0 8px; }
body.hub .scards { margin-bottom:30px; }

/* crowd chip (matches crowd.js) lives in crowd.js-injected CSS; this is a fallback */
.mgc-crowd { font-family:var(--sans); }

/* ============================ LANDING CHROME ============================ */
.mstrip { background:var(--ink); color:var(--on-ink); overflow:hidden; white-space:nowrap; border-bottom:1px solid var(--ink); }
.mstrip .track { display:inline-flex; gap:26px; padding:7px 0; animation:tick 90s linear infinite; }
.mstrip:hover .track { animation-play-state:paused; }
@keyframes tick { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.mstrip .t { font:12px var(--mono); color:var(--on-ink-mute); font-variant-numeric:tabular-nums; }
.mstrip .t b { color:var(--on-ink); } .mstrip .t .up{color:#5DCAA5} .mstrip .t .down{color:#F09595}

.masthead { text-align:center; padding:20px 0 8px; border-bottom:1px solid var(--border); }
.masthead .wm { font-family:var(--serif); font-weight:700; font-size:34px; letter-spacing:-.02em; color:var(--text); }
.masthead .tagline { font-size:12px; color:var(--text-3); text-transform:uppercase; letter-spacing:.22em; margin-top:4px; }
.masthead .dateline { font-size:12px; color:var(--text-2); margin-top:6px; font-variant-numeric:tabular-nums; }

/* today's outlook — the sentiment/astrology strip, ONE line */
.outlook { display:flex; align-items:center; gap:14px; background:var(--ink); color:var(--on-ink);
  border-radius:12px; padding:11px 16px; margin:16px 0 20px; font-size:13.5px; flex-wrap:wrap; }
.outlook .mood { font:700 13px var(--sans); text-transform:uppercase; letter-spacing:.06em; display:flex; align-items:center; gap:9px; }
.outlook .dial { width:120px; height:7px; border-radius:5px; background:linear-gradient(90deg,#B42318,#E8A33D,#1F7A3D); position:relative; }
.outlook .dial > i { position:absolute; top:-3px; width:3px; height:13px; background:#fff; border-radius:2px; }
.outlook .mood .score { font-family:var(--mono); }
.outlook .say { color:var(--on-ink-mute); font-style:italic; flex:1; min-width:220px; }
.outlook .domsin { color:var(--signal); font-weight:700; white-space:nowrap; }

/* lead + rail */
.frontgrid { display:grid; grid-template-columns:1.7fr 1fr; gap:26px; margin-bottom:8px; }
@media (max-width:900px){ .frontgrid{ grid-template-columns:1fr; } }
.lead-card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:22px 24px; }
.lead-card .eyebrow { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.12em; color:var(--accent); }
.lead-card h2 { font-size:32px; line-height:1.12; margin:8px 0 10px; }
.lead-card h2 a { color:var(--text); } .lead-card h2 a:hover{ color:var(--accent); text-decoration:none; }
.lead-card .why { font-family:var(--serif); font-size:17px; color:var(--text-2); line-height:1.5; margin-bottom:14px; }
.rail h3 { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.12em; color:var(--text-3); border-bottom:2px solid var(--accent); padding-bottom:5px; margin:0 0 6px; }
.rail .ri { display:block; padding:11px 0; border-bottom:1px solid var(--border); color:var(--text); }
.rail .ri:hover{ text-decoration:none; } .rail .ri:hover .rt{ color:var(--accent); }
.rail .rt { font-family:var(--serif); font-size:15.5px; line-height:1.3; }
.rail .rm { font:11.5px var(--mono); color:var(--text-3); margin-top:4px; font-variant-numeric:tabular-nums; }
.rail .rm .o{ color:var(--text); font-weight:700; } .rail .rm .up{color:var(--green)} .rail .rm .down{color:var(--red)}

/* odds duo on cards */
.odds2 { display:flex; gap:14px; align-items:flex-end; margin:6px 0 2px; }
.odds2 .o { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.odds2 .o .n { font-size:26px; font-weight:700; } .odds2 .ours .n{ color:var(--amber); } .odds2 .crowd .n{ color:var(--text); }
.odds2 .o .k { font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-3); display:block; }
.odds2 .edge { font:700 12px var(--mono); padding:2px 7px; border-radius:5px; align-self:center; }
.odds2 .edge.pos{ background:var(--green-bg); color:var(--green); } .odds2 .edge.neg{ background:var(--red-bg); color:var(--red); }
.fillbar { height:6px; background:var(--surface-2); border-radius:4px; overflow:hidden; margin:8px 0; }
.fillbar > i { display:block; height:100%; background:var(--amber); border-radius:4px; }
.chain { font-size:12.5px; color:var(--text-2); margin:8px 0; }
.tagrow { display:flex; gap:6px; flex-wrap:wrap; margin:8px 0; }
.tagrow .tg { font:11px var(--sans); background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:2px 8px; color:var(--text-2); }

/* desks */
.desk { margin:8px 0 22px; }
.desk .dh { display:flex; align-items:center; gap:10px; border-bottom:2px solid var(--text); padding-bottom:5px; margin-bottom:12px; }
.desk .dh h2 { font-size:15px; text-transform:uppercase; letter-spacing:.08em; margin:0; }
.desk .dh .see { margin-left:auto; font:600 12px var(--sans); }

/* room for disagreement */
.disagree { background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--signal); border-radius:12px; padding:16px 18px; margin:8px 0 24px; }
.disagree h2 { font-size:17px; margin:0 0 4px; } .disagree .sub{ color:var(--text-2); font-size:13px; margin-bottom:12px; }

/* seven sins ledger — instrument panel, always dark, below the fold */
.sins { background:var(--ink); color:var(--on-ink); border-radius:14px; padding:18px 20px; margin:10px 0 26px; }
.sins h2 { color:var(--on-ink); font-size:16px; margin:0 0 3px; }
.sins .sub { color:var(--on-ink-mute); font-size:12.5px; margin-bottom:14px; }
.sins .grid7 { display:grid; grid-template-columns:repeat(7,1fr); gap:12px; } @media(max-width:760px){ .sins .grid7{ grid-template-columns:repeat(2,1fr); } }
.sins .sin { } .sins .sin .nm { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.05em; color:var(--on-ink); display:flex; gap:5px; align-items:center; }
.sins .sin .bar { height:6px; background:rgba(255,255,255,.1); border-radius:4px; margin:7px 0 5px; overflow:hidden; }
.sins .sin .bar>i { display:block; height:100%; background:var(--signal); }
.sins .sin .v { font:700 13px var(--mono); color:var(--on-ink); } .sins .sin .d { font-size:10.5px; color:var(--on-ink-mute); }
.sins .ruled { color:var(--signal); font-weight:700; margin-top:13px; font-size:13px; }

footer.sitefoot { border-top:1px solid var(--border); margin-top:30px; padding:20px 0 50px; font-size:12.5px; color:var(--text-3); }
footer.sitefoot a { color:var(--text-2); } footer.sitefoot .links{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:8px; }
footer.sitefoot b { color:var(--text-2); }

/* ============================ ARTICLE: 2-COLUMN + RAIL ============================ */
body.article .wrap.article-wrap { max-width:1180px; }
.article-grid { display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:34px; align-items:start; }
@media (max-width:900px){ .article-grid{ grid-template-columns:1fr; } }
.article-grid .main { min-width:0; }
.wi-eyebrow { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.14em; color:var(--accent); margin:8px 0 4px; }
h1 .wi { font-style:italic; color:var(--text-2); font-weight:500; }
.chart-sec #sv-chart { background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:8px; min-height:300px; }
.mm-full-btn { float:right; font:600 11px var(--sans); background:var(--surface-2); border:1px solid var(--border); color:var(--text-2); border-radius:7px; padding:4px 10px; cursor:pointer; }
.mm-full-btn:hover { border-color:var(--accent); color:var(--text); }
.mrow { cursor:pointer; } .mrow:hover td { background:var(--surface-2); }
.acell { border-bottom:1px dashed var(--text-3); }
.chart-chip { font:10px var(--sans); color:var(--accent); margin-left:7px; opacity:.65; } .mrow:hover .chart-chip { opacity:1; }

/* sticky right rail */
.railcol { position:sticky; top:64px; display:flex; flex-direction:column; gap:16px; }
@media (max-width:900px){ .railcol{ position:static; } }
.rail-box { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:15px 16px; }
.rail-box .cb-h, .rail-box .nb-h { font:700 12px var(--sans); text-transform:uppercase; letter-spacing:.08em; color:var(--text-3); margin-bottom:10px; }
.rail-box.notify { background:var(--ink); color:var(--on-ink); border-color:var(--ink); }
.rail-box.notify .nb-h { color:var(--signal); }
.rail-box.notify .nb-p { font-size:12.5px; color:var(--on-ink-mute); line-height:1.5; margin:0 0 11px; }
.notify-form { display:flex; gap:7px; } .notify-form input { flex:1; min-width:0; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); color:var(--on-ink); border-radius:7px; padding:8px 10px; font:13px var(--sans); }
.notify-form input::placeholder { color:var(--on-ink-mute); }
.notify-form button { background:var(--signal); color:var(--ink); border:none; border-radius:7px; padding:8px 12px; font:700 12.5px var(--sans); cursor:pointer; white-space:nowrap; }
.nb-ok { font-size:13px; color:var(--signal); margin-top:9px; line-height:1.5; }
.connected .ci-list { display:flex; flex-direction:column; }
.connected .ci { display:flex; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid var(--border); color:var(--text); align-items:baseline; }
.connected .ci:last-child { border-bottom:none; } .connected .ci:hover { text-decoration:none; } .connected .ci:hover .ci-t{ color:var(--accent); }
.connected .ci-t { font-family:var(--serif); font-size:14.5px; line-height:1.3; }
.connected .ci-p { font:700 12px var(--mono); color:var(--amber); font-variant-numeric:tabular-nums; }
.connected .cb-more { display:inline-block; margin-top:10px; font:600 12.5px var(--sans); }
.rail-box.trade .cta { display:block; text-align:center; margin-bottom:8px; }
.rail-box.trade .cta:last-child { margin-bottom:0; }

/* ============================ BREAKING + UPCOMING (landing) ============================ */
.breaking { background:var(--ink); color:var(--on-ink); border-radius:14px; padding:16px 18px; margin:4px 0 22px; }
.brk-h { font:700 13px var(--sans); color:var(--on-ink); margin-bottom:12px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.brk-tag { color:#F09595; font-weight:800; text-transform:uppercase; letter-spacing:.06em; font-size:11px; animation:blink 1.8s infinite; }
@keyframes blink { 50%{opacity:.45} }
.brk-list { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(255,255,255,.08); border-radius:8px; overflow:hidden; }
@media(max-width:760px){ .brk-list{ grid-template-columns:1fr; } }
.brk { background:var(--ink); padding:11px 13px; }
.brk .bt { font:600 11px var(--sans); text-transform:uppercase; letter-spacing:.05em; color:var(--signal); }
.brk .bx { font-family:var(--serif); font-size:14px; color:var(--on-ink); margin:3px 0; line-height:1.35; }
.brk a { color:#9fb4ff; font-size:12.5px; } .brk .muted2{ color:var(--on-ink-mute); font-size:11.5px; }
.brk-more { display:inline-block; margin-top:11px; color:var(--signal); font:700 12.5px var(--sans); }

.up-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; }
.upc { background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:10px; padding:13px 15px; }
.upc .ud { font:700 12px var(--mono); color:var(--accent); } .upc .ueta{ color:var(--text-3); font-weight:400; }
.upc .ut { font-family:var(--serif); font-size:16px; margin:5px 0; line-height:1.25; }
.upc .uw { font-size:12.5px; color:var(--text-2); line-height:1.45; margin-bottom:9px; }
.upc .uscn a { font-size:12.5px; display:block; margin:3px 0; }
.upc .ucta { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.upc .ucta a { font:700 11.5px var(--sans); padding:5px 10px; border-radius:6px; }
.upc .ucta .poly { background:#1652f0; color:#fff; } .upc .ucta .kalshi{ background:#00d09c; color:#04231b; }

/* ============================================================================
 * NEWSPAPER FRONT PAGE (CNN/WaPo-style media layout)
 * ========================================================================== */
body.landing .masthead { padding:22px 0 10px; border-bottom:2px solid var(--ink); }
body.landing .masthead .wm { font-size:clamp(32px,6vw,52px); }
body.landing .masthead .tagline { font-family:var(--serif); font-style:italic; font-size:15px; text-transform:none; letter-spacing:0; color:var(--text-2); margin-top:2px; }
body.landing .masthead .dateline { letter-spacing:.04em; }

/* thin breaking bar (CNN red) */
.breaking-bar { display:flex; align-items:center; gap:0; background:var(--breaking-red); color:#fff; overflow:hidden; }
.breaking-bar[hidden] { display:none; }   /* stay hidden until news-live.js populates it */
.breaking-bar .bb-tag { font:800 11px var(--sans); text-transform:uppercase; letter-spacing:.1em; padding:7px 12px; background:rgba(0,0,0,.18); white-space:nowrap; animation:blink 1.8s infinite; }
.bb-track { flex:1 1 auto; overflow:hidden; } .bb-track::-webkit-scrollbar{display:none}
.bb-scroll { display:inline-flex; white-space:nowrap; animation:bbscroll 50s linear infinite; will-change:transform; }
.breaking-bar:hover .bb-scroll, .breaking-bar:focus-within .bb-scroll { animation-play-state:paused; }   /* WCAG 2.2.2: pausable */
.bb-dup { display:contents; }   /* visual loop copy; aria-hidden so AT reads the set once */
@keyframes bbscroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.bb-item { display:inline-flex; align-items:center; padding:7px 14px; font-size:12.5px; color:#fff; white-space:nowrap; border-left:1px solid rgba(255,255,255,.18); }
.bb-item:hover { background:rgba(0,0,0,.15); text-decoration:none; } .bb-item b { font-weight:700; }
@media (prefers-reduced-motion: reduce){ .bb-scroll{ animation:none; } .bb-track{ overflow-x:auto; } }

/* section nav */
.sectionnav { border-bottom:1px solid var(--border); background:var(--surface); position:sticky; top:0; z-index:40; }
.sn-inner { max-width:var(--maxw); margin:0 auto; padding:0 22px; display:flex; gap:0 16px; flex-wrap:nowrap; align-items:center; }
.sn-links { display:flex; flex-wrap:wrap; gap:2px 16px; align-items:center; flex:1 1 auto; min-width:0; }
.sectionnav a { font:600 13px var(--sans); color:var(--text); padding:11px 0; white-space:nowrap; border-bottom:2px solid transparent; }
.sectionnav a:hover { color:var(--accent); text-decoration:none; border-bottom-color:var(--accent); }
.sectionnav .sn-front { font-weight:800; }
.sectionnav a.on { color:var(--accent); border-bottom-color:var(--accent); }

/* nav search (combobox typeahead over the whole library) */
.nav-search { position:relative; flex:0 0 auto; }   /* fixed slot — sn-links flex:1 pushes it right; no margin-left:auto (that caused the wrap-gap) */
.nav-search input { width:190px; max-width:46vw; font:13px var(--sans); color:var(--text); background-color:var(--surface-2);
  border:1px solid var(--border); border-radius:999px; padding:7px 14px 7px 31px; outline:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23938B7D' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>");
  background-repeat:no-repeat; background-position:10px center; }
.nav-search input::-webkit-search-cancel-button{ -webkit-appearance:none; }
.nav-search input:focus { border-color:var(--accent); background-color:var(--surface); box-shadow:0 0 0 3px var(--accent-bg); }
.ns-results { position:absolute; top:calc(100% + 7px); right:0; width:min(440px, calc(100vw - 24px)); background:var(--surface);
  border:1px solid var(--border); border-radius:12px; box-shadow:0 12px 32px rgba(0,0,0,.18); overflow:hidden auto; z-index:60; max-height:min(70vh,520px); }
.ns-item { display:flex; align-items:center; gap:12px; padding:9px 15px; color:var(--text); border-bottom:1px solid var(--border); }
.ns-item:hover, .ns-item.on { background:var(--surface-2); text-decoration:none; }
.ns-main { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; }
.ns-kick { font:700 9px var(--sans); text-transform:uppercase; letter-spacing:.07em; color:var(--accent); line-height:1.1; }
.ns-t { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family:var(--serif); font-size:14.5px; line-height:1.3; color:var(--text); }
.ns-item.on .ns-t, .ns-item:hover .ns-t { color:var(--accent); }
.ns-hl { background:var(--amber-bg); color:var(--text); border-radius:2px; padding:0 1px; }
.ns-p { flex:0 0 auto; font:700 12px var(--mono); font-variant-numeric:tabular-nums; padding:3px 8px; border-radius:6px; }
.ns-p.hi { color:var(--green); background:var(--green-bg); } .ns-p.mid { color:var(--gold); background:var(--amber-bg); } .ns-p.lo { color:var(--text-2); background:var(--surface-2); }
.ns-empty { padding:15px; color:var(--text-3); font-size:13px; }
.ns-foot { padding:9px 14px; font-size:11px; color:var(--text-3); background:var(--surface-2); display:flex; justify-content:space-between; align-items:center; gap:8px; }
.ns-foot kbd { font:600 10px var(--mono); background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:1px 5px; color:var(--text-2); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:700px){ .sn-inner{ flex-wrap:wrap; } .sn-links{ flex-basis:100%; } .nav-search{ flex-basis:100%; width:100%; } .nav-search input{ width:100%; max-width:none; } .ns-results{ width:100%; } }

/* ── section (sector) front pages: an editorial section masthead + headline river ── */
.sec-masthead { padding:26px 0 16px; border-bottom:2px solid var(--text); margin:6px 0 24px; }
.sec-eyebrow { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.14em; color:var(--accent); margin-bottom:7px; }
.sec-title { font-family:var(--serif); font-size:48px; line-height:1.02; font-weight:800; letter-spacing:-.015em; margin:0; }
.sec-standfirst { font-family:var(--serif); font-size:18.5px; line-height:1.45; color:var(--text-2); margin:9px 0 0; max-width:62ch; }
.sec-meta { font:600 11.5px var(--sans); color:var(--text-3); margin-top:11px; text-transform:uppercase; letter-spacing:.06em; }
.sec-feat { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin:0 0 28px; }
.sec-feat .story.st-feat { margin:0; }
/* country filter: a sticky chip row that segregates the river below it */
.sec-filter { position:sticky; top:43px; z-index:30; background:var(--bg); border-bottom:1px solid var(--border); padding:11px 0 12px; margin:0 0 16px; }
.sec-filter .cf-label { font:700 10.5px var(--sans); text-transform:uppercase; letter-spacing:.1em; color:var(--text-3); margin-bottom:9px; }
.cf-chips { display:flex; gap:8px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.cf-chips::-webkit-scrollbar { display:none; }
.cc-chip { flex:0 0 auto; font:600 12.5px var(--sans); color:var(--text-2); background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:5px 13px; cursor:pointer; white-space:nowrap; }
.cc-chip:hover { border-color:var(--accent); color:var(--accent); }
.cc-chip.on { background:var(--accent); color:#fff; border-color:var(--accent); }
.cc-chip .cc-n { opacity:.55; font-variant-numeric:tabular-nums; margin-left:3px; }
.cc-chip.on .cc-n { opacity:.85; }
/* river = column-flow so hiding items on filter rebalances the two columns automatically */
.sec-river { column-count:2; column-gap:40px; margin-top:2px; }
.sec-river li { break-inside:avoid; }
@media (max-width:860px){ .sec-feat{ grid-template-columns:1fr 1fr; } }
@media (max-width:760px){ .sec-title{ font-size:33px; } .sec-feat{ grid-template-columns:1fr; } .sec-river{ column-count:1; } .sec-filter{ top:0; } }

body.landing .wrap.paper { max-width:1220px; padding-top:18px; }

/* ruled section header (newspaper) */
.rule-h { display:flex; align-items:center; justify-content:space-between; border-top:2px solid var(--ink); margin:30px 0 14px; padding-top:8px; }
.rule-h h2 { font-family:var(--serif); font-size:22px; margin:0; font-weight:700; } .rule-h h2 a{ color:var(--text); } .rule-h h2 a:hover{ color:var(--accent); text-decoration:none; }
.rule-h .see { font:600 12.5px var(--sans); color:var(--accent); }

/* front page: lead + top-stories rail */
.frontpage { display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:34px; padding-top:6px; align-items:start; }
@media (max-width:900px){ .frontpage{ grid-template-columns:1fr; } }
.top-rail { border-left:1px solid var(--border); padding-left:22px; }
@media (max-width:900px){ .top-rail{ border-left:none; padding-left:0; border-top:2px solid var(--ink); padding-top:10px; } }
.rail-h { font:800 12px var(--sans); text-transform:uppercase; letter-spacing:.1em; color:var(--text); border-bottom:2px solid var(--accent); padding-bottom:6px; margin-bottom:6px; }
ul.headlines { list-style:none; margin:0; padding:0; }
ul.headlines li { display:flex; gap:10px; justify-content:space-between; align-items:flex-start; padding:10px 0; border-bottom:1px solid var(--border); }
ul.headlines li:last-child { border-bottom:none; }
ul.headlines a { display:flex; flex-direction:column; gap:3px; flex:1; }
ul.headlines a:hover { text-decoration:none; } ul.headlines a:hover .hl-t { color:var(--accent); }
ul.headlines .hl-kick { font:700 9.5px var(--sans); text-transform:uppercase; letter-spacing:.07em; color:var(--accent); }
ul.headlines .hl-t { font-family:var(--serif); font-size:15px; line-height:1.28; color:var(--text); }
ul.headlines .hl-p { font:700 12px var(--mono); color:var(--amber); font-variant-numeric:tabular-nums; padding-top:1px; }
.rail-allcta { display:inline-block; margin-top:12px; font:600 13px var(--sans); }

/* media story card */
.story .art { display:flex; align-items:flex-end; justify-content:space-between; padding:12px; border-radius:10px; overflow:hidden; position:relative; min-height:150px; }
.story .art .art-wm { position:absolute; right:-6px; top:-22px; font-size:120px; opacity:.16; filter:grayscale(.2); }
.story .art .art-prob { font:800 30px var(--mono); color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.4); font-variant-numeric:tabular-nums; }
.story .art .art-prob span { font-size:16px; opacity:.85; }
.story .body { padding-top:11px; }
.story .kicker { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; }
.story .kicker a { color:var(--accent); }
.story .hl { font-family:var(--serif); font-weight:700; line-height:1.16; margin:0 0 8px; }
.story .hl a { color:var(--text); } .story .hl a:hover { color:var(--accent); text-decoration:none; }
.story .dek { font-size:14px; color:var(--text-2); line-height:1.5; margin:0 0 9px; }
.story .byline { font:12px var(--sans); color:var(--text-3); }
.story .byline .bl-prob { color:var(--amber); font-weight:700; } .story .byline .bl-crowd b{ color:var(--text-2); }
.st-hero .art { min-height:230px; } .st-hero .art .art-wm{ font-size:170px; } .st-hero .art .art-prob{ font-size:40px; }
.st-hero .hl { font-size:clamp(26px,3.6vw,38px); }
.st-hero .dek { font-size:16.5px; }
.st-feat .hl { font-size:21px; } .st-feat .art { min-height:140px; }
.st-small .hl { font-size:18px; } .st-small { border-top:3px solid var(--accent); padding-top:10px; }

.story-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
@media (max-width:900px){ .story-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .story-grid{ grid-template-columns:1fr; } }

/* desk section: featured + headline river */
.desk-grid { display:grid; grid-template-columns: minmax(0,1fr) 1fr; gap:30px; }
@media (max-width:760px){ .desk-grid{ grid-template-columns:1fr; } }

/* sector gradients (the "art" slot — duotone, no photos needed) */
.grad-geopolitics { background:linear-gradient(135deg,#7a1d1d,#2a0e0e); }
.grad-macro       { background:linear-gradient(135deg,#16386f,#0b1830); }
.grad-energy      { background:linear-gradient(135deg,#8a5a16,#2e1d07); }
.grad-crypto      { background:linear-gradient(135deg,#5a3aa0,#1f1338); }
.grad-tech        { background:linear-gradient(135deg,#106b6b,#06241f); }
.grad-markets     { background:linear-gradient(135deg,#1f6e43,#0a2417); }
.grad-society     { background:linear-gradient(135deg,#475569,#1c232e); }
.story .art:hover { filter:brightness(1.08); }

/* ── horizontal-slide carousels (smooth swipe; dots overlaid ON the section) ── */
.slider { position:relative; overflow:hidden; }
.slider .strack { display:flex; transition:transform .7s cubic-bezier(.22,.61,.36,1); will-change:transform; }
.slider .sslide { flex:0 0 100%; min-width:0; }
.sgrid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
@media (max-width:900px){ .sgrid4 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .sgrid4 { grid-template-columns:1fr; } }
/* dots: overlaid on the carousel itself, bottom-centre (Bing pattern) */
.rot-dots { position:absolute; left:0; right:0; bottom:10px; z-index:5; display:flex; gap:6px; justify-content:center; align-items:center; }
.rot-dot { width:7px; height:7px; border-radius:999px; border:none; padding:0; cursor:pointer; transition:width .3s ease, background .3s ease; background:var(--border); }
.rot-dot.on { width:22px; }
/* mtw + desk: text cards, so reserve a strip at the bottom for the dots (accent) */
.mtw-slider, .feat-slider { padding-bottom:26px; }
.mtw-slider .rot-dot, .feat-slider .rot-dot { background:var(--border); } .mtw-slider .rot-dot.on, .feat-slider .rot-dot.on { background:var(--accent); }
.mtw-slider .rot-dot:hover, .feat-slider .rot-dot:hover { background:var(--text-3); }

/* hero = a full "image" slide with overlaid headline + dots */
.hslide { display:block; position:relative; height:380px; border-radius:14px; overflow:hidden; color:#fff; }
@media (max-width:560px){ .hslide { height:300px; } }
.hslide:hover { text-decoration:none; }
.hslide .art-wm { position:absolute; right:-14px; top:-34px; font-size:230px; opacity:.16; }
.hslide .hs-prob { position:absolute; top:16px; left:18px; z-index:2; font:800 32px var(--mono); color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.5); font-variant-numeric:tabular-nums; }
.hslide .hs-prob small { font:700 12px var(--sans); opacity:.85; text-transform:uppercase; letter-spacing:.06em; }
.hslide .hs-scrim { position:absolute; left:0; right:0; bottom:0; padding:60px 28px 44px; background:linear-gradient(transparent, rgba(8,8,10,.82)); }
.hslide .hs-kick { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.1em; opacity:.9; margin-bottom:7px; }
.hslide .hs-hl { font-family:var(--serif); font-weight:700; font-size:clamp(23px,2.9vw,34px); line-height:1.14; margin:0 0 8px; color:#fff; }
.hslide .hs-dek { font-size:14px; line-height:1.5; opacity:.85; margin:0; max-width:60ch; }
.hero-slider .rot-dots { bottom:16px; } .hero-slider .rot-dot { background:rgba(255,255,255,.5); } .hero-slider .rot-dot.on { background:#fff; }

/* prev/next arrows on the hero carousel (fade in on hover) */
.rot-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:6; width:38px; height:38px; border-radius:50%; border:none;
  background:rgba(10,10,12,.45); color:#fff; font:300 24px/1 var(--sans); cursor:pointer; display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .2s, background .2s; }
.slider:hover .rot-arrow { opacity:1; }
.rot-arrow:hover { background:rgba(10,10,12,.72); }
.rot-arrow.prev { left:10px; } .rot-arrow.next { right:10px; }
@media (max-width:560px){ .rot-arrow { opacity:1; } }

/* vertical headline marquee (the "latest" rail, continuously scrolling) */
.rail-marquee { height:300px; overflow:hidden; position:relative;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 5%,#000 95%,transparent); }
.rail-marquee .marquee-track { animation:vscroll 42s linear infinite; }
.rail-marquee:hover .marquee-track { animation-play-state:paused; }
@keyframes vscroll { from { transform:translateY(0); } to { transform:translateY(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .slider .strack { transition:none; }
  .rail-marquee { height:auto; -webkit-mask-image:none; mask-image:none; }
  .rail-marquee .marquee-track { animation:none; }
}

/* ── risk-driver chips (scenario page) + /risks hubs & index ── */
.rootchip { display:inline-block; color:var(--text-2); border-bottom:1px dashed var(--border); white-space:nowrap; }
.rootchip:hover { color:var(--accent); border-color:var(--accent); text-decoration:none; }
.dir.up { color:var(--green); } .dir.dn { color:var(--red); }
.risk-filter { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 16px; }
.riskindex { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:12px; overflow:hidden; margin-top:6px; }
.riskrow { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--surface); padding:13px 16px; color:var(--text); }
.riskrow:hover { background:var(--surface-2); text-decoration:none; }
.riskrow .rr-name { font-family:var(--serif); font-size:15.5px; line-height:1.25; }
.riskrow .rr-meta { display:flex; align-items:center; gap:9px; font:600 11.5px var(--mono); white-space:nowrap; font-variant-numeric:tabular-nums; }
.riskrow .rr-tot { color:var(--text); font-size:13px; }

/* ── scenario page: "what to do" guidance + measured historical precedent ── */
.todo-sec .guide { background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:16px 18px; }
.g-lead { font-weight:700; color:var(--gold); margin-bottom:12px; }
.g-row { display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; margin:8px 0; }
.g-lbl { flex:0 0 auto; font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.06em; width:50px; padding-top:5px; }
.g-lbl.l { color:var(--green); } .g-lbl.s { color:var(--red); } .g-lbl.c { color:var(--gold); }
.gtags { display:flex; gap:8px; flex-wrap:wrap; flex:1; }
.gtag { display:inline-flex; align-items:center; gap:7px; font:600 12.5px var(--sans); padding:5px 11px; border-radius:8px; border:1px solid var(--border); background:var(--surface); }
.gtag.long { color:var(--green); } .gtag.short { color:var(--red); }
.gtag:hover { text-decoration:none; border-color:currentColor; }
.gtag .gt-sym { font-family:var(--mono); font-size:11.5px; }
.gtag .gt-ex { color:var(--text-2); font-family:var(--mono); font-size:11.5px; }
.g-common { font-size:13.5px; color:var(--text-2); line-height:1.55; margin-top:12px; } .g-common b { color:var(--text); }
.g-common .ex.up { color:var(--green); font-family:var(--mono); font-size:12px; } .g-common .ex.down { color:var(--red); font-family:var(--mono); font-size:12px; }

.hist-sec .histcap { font-size:12px; color:var(--text-3); line-height:1.55; margin:-2px 0 12px; } .hist-sec .histcap b { color:var(--text-2); }
.hist-sec .analogues { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:14px; }
.hist-sec .ana { font-size:11px; background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:3px 10px; color:var(--text-2); white-space:nowrap; }
.hist-sec .ana a { color:var(--text-3); margin-left:3px; } .hist-sec .ana a:hover { color:var(--accent); }
.histbox { overflow-x:auto; }
table.hist { width:100%; border-collapse:collapse; font-size:13px; min-width:560px; }
table.hist th { text-align:left; color:var(--text-3); font-weight:600; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; padding:7px 8px; border-bottom:1px solid var(--border); }
table.hist td { padding:8px; border-bottom:1px solid var(--border); vertical-align:middle; }
table.hist .mv { font-family:var(--mono); font-size:12.5px; font-weight:700; } table.hist .mv.up { color:var(--green); } table.hist .mv.down { color:var(--red); }
table.hist .rawnote { color:var(--text-3); font-weight:400; font-size:11px; }
.sig { font:700 10.5px var(--sans); padding:2px 8px; border-radius:5px; } .sig.long { background:var(--green-bg); color:var(--green); } .sig.short { background:var(--red-bg); color:var(--red); }
.hbar { width:52px; height:5px; background:var(--surface-2); border-radius:3px; display:inline-block; overflow:hidden; vertical-align:middle; } .hbar>i { display:block; height:100%; }
.vs-agree { color:var(--green); font-size:11px; } .vs-dis { color:var(--amber); font-size:11px; } .vs-na { color:var(--text-3); }
.fade { color:var(--amber); font-size:11px; }

/* ============================================================================
 * "THE WEEK AHEAD" — catalyst playbook pages (3 outcomes · butterfly cascade · what-to-do)
 * ========================================================================== */
.wa-masthead { padding:16px 0 14px; border-bottom:2px solid var(--text); margin:4px 0 22px; }
.wa-title { font-family:var(--serif); font-size:clamp(27px,4.5vw,42px); line-height:1.04; font-weight:800; letter-spacing:-.015em; margin:6px 0 8px; }
.wa-standfirst { font-family:var(--serif); font-size:18px; line-height:1.5; color:var(--text-2); margin:0 0 12px; max-width:64ch; }
.wa-next { display:inline-flex; align-items:center; gap:8px; background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:5px 13px; font-size:13px; margin:2px 0 10px; }
.wa-next-k { font:700 10px var(--sans); text-transform:uppercase; letter-spacing:.08em; color:var(--text-3); }
.wa-watch { font-size:13.5px; color:var(--text-2); line-height:1.55; margin:6px 0; } .wa-watch b { color:var(--text); }
.wa-howto { font-size:12.5px; color:var(--text-3); line-height:1.6; margin-top:10px; border-top:1px dashed var(--border); padding-top:10px; } .wa-howto b { color:var(--text-2); }

.wa-out { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:18px 20px; margin:0 0 18px; }
.wa-out-head { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.wa-out-head h2 { font-size:20px; margin:0; flex:1 1 auto; min-width:0; line-height:1.2; }
.wa-prob { font:800 18px var(--mono); font-variant-numeric:tabular-nums; padding:4px 11px; border-radius:9px; }
.wa-prob.hi { color:var(--green); background:var(--green-bg); } .wa-prob.mid { color:var(--gold); background:var(--amber-bg); } .wa-prob.lo { color:var(--text-2); background:var(--surface-2); }
.wa-tag { font:700 10px var(--sans); text-transform:uppercase; letter-spacing:.06em; padding:3px 9px; border-radius:999px; white-space:nowrap; }
.wa-tag.risk-on { background:var(--green-bg); color:var(--green); } .wa-tag.risk-off { background:var(--red-bg); color:var(--red); } .wa-tag.mixed { background:var(--amber-bg); color:var(--amber); }
.wa-thesis { font-size:14.5px; line-height:1.6; color:var(--text); margin:0 0 14px; }

.wa-casc { background:var(--bg); border:1px solid var(--border); border-radius:11px; padding:13px 15px; margin:0 0 14px; }
.casc-grp { font:700 11px var(--sans); text-transform:uppercase; letter-spacing:.06em; color:var(--text-2); margin:12px 0 7px; } .casc-grp:first-child { margin-top:0; }
.casc-sub { color:var(--text-3); font-weight:400; text-transform:none; letter-spacing:0; }
.casc-list { list-style:none; margin:0; padding:0; }
.casc-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1px 12px; align-items:baseline; padding:7px 0; border-bottom:1px solid var(--border); }
.casc-row:last-child { border-bottom:none; }
.casc-a { font-weight:700; font-size:13.5px; } .casc-a.up { color:var(--green); } .casc-a.down { color:var(--red); } .casc-a.flat { color:var(--text-2); }
.casc-k { font:600 10px var(--mono); color:var(--text-3); margin-left:3px; }
.casc-m { font:700 12.5px var(--mono); font-variant-numeric:tabular-nums; color:var(--text); text-align:right; white-space:nowrap; }
.casc-n { grid-column:1 / -1; font-size:12.5px; color:var(--text-2); line-height:1.45; }

.wa-page .todo-sec h3 { font-size:14px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-3); margin:0 0 8px; }

/* week-ahead index */
.wai-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:12px; overflow:hidden; margin:6px 0 30px; }
.wai-card { display:block; background:var(--surface); padding:16px 18px; color:var(--text); }
.wai-card:hover { background:var(--surface-2); text-decoration:none; } .wai-card:hover .wai-title { color:var(--accent); }
.wai-kick { font:700 9.5px var(--sans); text-transform:uppercase; letter-spacing:.08em; color:var(--accent); margin-bottom:5px; }
.wai-title { font-family:var(--serif); font-size:18px; font-weight:700; line-height:1.2; }
.wai-meta { font-size:12px; color:var(--text-3); margin-top:6px; } .wai-eta { color:var(--accent); font-weight:600; margin-left:4px; }

/* "read the playbook" CTA on the landing's week-ahead cards */
.upc-play { display:block; margin:1px 0 9px; font:700 12.5px var(--sans); color:var(--accent); }
.upc-play:hover { text-decoration:none; color:var(--text); }

@media (max-width:560px) {
  .wa-out { padding:15px 14px; } .wa-out-head h2 { font-size:18px; }
  .wa-prob { font-size:16px; padding:3px 9px; }
  .wa-casc { padding:12px 12px; } .casc-row { grid-template-columns:1fr auto; } .casc-m { font-size:12px; }
}

/* ============================================================================
 * MOBILE / RESPONSIVE — consolidated phone+tablet pass.
 * Goals (web consensus): no horizontal overflow, no sticky element covering
 * content, ≥44px touch targets (Apple HIG) / 24px min (WCAG 2.5.8), ≥16px form
 * inputs so iOS doesn't zoom on focus, fluid type (already via clamp()).
 * The news-board (landing, the 5,141 scenario pages, section fronts, hubs) all
 * share this file, so every fix here lands everywhere at once.
 * ========================================================================== */

/* coarse-pointer devices: give the primary actions a real tap area */
@media (hover:none) and (pointer:coarse) {
  .cta, .notify-form button, .mm-full-btn, .rail-allcta, .sc-readmore { min-height:44px; }
  .cta { padding:11px 16px; }
}

/* When the multi-column grids stack to 1fr, the track is minmax(auto,1fr) and a
   carousel / oversized display child can force its min-content (e.g. 440px) onto
   the track, blowing the page wider than the viewport. min-width:0 lets the grid
   items shrink so sliders clip and text wraps instead. */
@media (max-width:900px) {
  .frontpage > *, .frontgrid > *, .hero > *, .article-grid > *,
  .desk-grid > *, .river > *, .story-grid > *, .sgrid4 > *, .sec-feat > * { min-width:0; }
  .slider, .strack, .sslide { min-width:0; max-width:100%; }
}

@media (max-width:700px) {
  .wrap { padding:0 16px; }

  /* section nav was sticky AND ~3 rows tall → it covered the article on scroll.
     On mobile it becomes a normal band that scrolls away, tightened up. */
  .sectionnav { position:static; }
  .sn-inner { padding:7px 16px 9px; gap:3px 16px; }
  .sectionnav a { padding:8px 0; }
  .nav-search { margin-top:5px; }
  .nav-search input { font-size:16px; padding-top:9px; padding-bottom:9px; }  /* 16px → no iOS zoom */

  /* the country-filter chip row used to sit under the sticky nav (top:43px) */
  .sec-filter { top:0; }

  /* article/hub topbar: brand on row 1, links scroll horizontally on row 2 */
  .topbar { flex-wrap:wrap; gap:6px 14px; padding:10px 16px; }
  .topbar .brand { font-size:18px; }
  .topbar .navlinks { margin-left:0; width:100%; gap:16px; flex-wrap:nowrap;
    overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .topbar .navlinks::-webkit-scrollbar { display:none; }
}

@media (max-width:560px) {
  /* hero carousel: stop the probability badge colliding with the headline/kicker.
     Give the badge a chip background, trim the scrim, clamp the headline, drop the
     dek (it's redundant beside the standfirst on a phone). */
  .hslide { height:344px; }
  .hslide .hs-prob { top:11px; left:11px; font-size:24px; background:rgba(8,8,10,.5);
    padding:3px 10px; border-radius:9px; -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
  .hslide .hs-prob small { font-size:10px; }
  .hslide .hs-scrim { padding:40px 16px 18px; }
  .hslide .hs-hl { font-size:20px; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
  .hslide .hs-dek { display:none; }
  .hslide .art-wm { font-size:150px; }

  /* front-page lead story art */
  .st-hero .art { min-height:172px; } .st-hero .art .art-prob { font-size:32px; }

  /* analogue chips: long event names must WRAP, not push the page wider
     (this was the scenario-page horizontal-scroll culprit) */
  .hist-sec .ana { white-space:normal; }

  /* keep the measured-history table readable as a scroll region */
  .histbox { -webkit-overflow-scrolling:touch; }

  /* oddsbar gauge a touch smaller so the label sits cleanly beside it */
  .g-pct { font-size:36px; }

  /* guidance chips: let the expected-move text wrap inside the chip */
  .gtag { flex-wrap:wrap; }

  /* footer + cta rows: comfortable wrapping */
  footer.sitefoot .links { gap:12px 18px; }
}

/* very small phones (≤380): trim oversized display type a final notch */
@media (max-width:380px) {
  .masthead .wm, body.landing .masthead .wm { font-size:30px; }
  .sec-title { font-size:28px; }
  article h1 { font-size:25px; }
  .lead-card h2, .sc-lead .sc-title { font-size:25px; }
}

/* ── "Solid chance of happening" — front-page predictions band ── */
.solidpx { margin: 24px 0 8px; }
.rule-h.rule-solid { border-top-color: var(--accent); }
.sp-intro { margin: -6px 0 14px; max-width: 980px; line-height: 1.55; }
.sp-intro b { color: var(--text); }
.sp-regime, .sp-intro .sp-regime { color: var(--text-3); }
.sp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); gap: 14px; }
@media (max-width: 680px) { .sp-grid { grid-template-columns: 1fr; } }
.sp-card { display: grid; grid-template-columns: 88px 1fr; gap: 16px; background: var(--surface);
  border: 1px solid var(--border); border-top: 3px solid var(--accent); border-radius: 10px; padding: 15px 17px; }
.sp-card.sp-hi  { border-top-color: var(--green); }
.sp-card.sp-mid { border-top-color: var(--accent); }
.sp-card.sp-lo  { border-top-color: var(--amber); }
.sp-gauge { text-align: center; border-right: 1px solid var(--border); padding-right: 12px; }
.sp-pct { font: 800 30px/1 var(--mono, "SF Mono", Menlo, monospace); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.sp-pct span { font-size: 15px; opacity: .7; }
.sp-hi .sp-pct { color: var(--green); } .sp-mid .sp-pct { color: var(--accent); } .sp-lo .sp-pct { color: var(--amber); }
.sp-lbl { font-size: 9.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--text-3); margin-top: 4px; }
.sp-crowd { font-size: 10px; color: var(--text-3); margin-top: 10px; line-height: 1.3; }
.sp-crowd b { display: block; font-size: 13px; color: var(--text-2); font-variant-numeric: tabular-nums; }
.sp-main { min-width: 0; }
.sp-hl { font-family: var(--serif, Georgia, serif); font-size: 20px; line-height: 1.2; margin: 2px 0 6px; font-weight: 700; }
.sp-hl a { color: var(--text); } .sp-hl a:hover { color: var(--accent); text-decoration: none; }
.sp-what { font-size: 10.5px; text-transform: uppercase; letter-spacing: .07em; color: var(--text-3); margin: 10px 0 6px; }
.sp-assets { display: flex; flex-wrap: wrap; gap: 7px; }
.sp-assets .gtag { font-size: 12px; padding: 3px 9px; }
.sp-rec { font-size: 13px; line-height: 1.5; background: var(--surface-2); border-left: 3px solid var(--accent);
  border-radius: 0 8px 8px 0; padding: 9px 12px; margin: 11px 0 0; }
.sp-rec b { color: var(--accent); }
.sp-edge { font-size: 12px; color: var(--text-3); font-style: italic; margin-top: 8px; line-height: 1.45; }
.sp-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 11px; padding-top: 9px;
  border-top: 1px dashed var(--border); font-size: 11.5px; }
.sp-src { color: var(--text-3); } .sp-src a { color: var(--text-2); }
.sp-dd { margin-left: auto; color: var(--accent); font-weight: 700; white-space: nowrap; }
@media (max-width: 560px) { .sp-card { grid-template-columns: 64px 1fr; gap: 12px; padding: 13px 13px; }
  .sp-pct { font-size: 25px; } .sp-hl { font-size: 18px; } }

/* ── dedicated /predictions page extras ── */
.predpage { margin-top: 8px; }
.predpage .sp-intro { max-width: 760px; }
.predgrid { grid-template-columns: 1fr; }            /* full-width cards on the dedicated page */
@media (min-width: 920px) { .predgrid { grid-template-columns: repeat(2, 1fr); } }
.sp-x100 { font-size: 10px; color: var(--text-3); margin-top: 4px; font-variant-numeric: tabular-nums; }
.sp-vs { margin-top: 9px; font-size: 10px; color: var(--text-3); line-height: 1.4; }
.sp-vs b { color: var(--text-2); font-variant-numeric: tabular-nums; }
.sp-edge-d { display: block; font-weight: 700; margin-top: 2px; }
.sp-edge-d.up { color: var(--green); } .sp-edge-d.down { color: var(--red); }
.sp-resolve { font-size: 12px; color: var(--text-2); margin: 8px 0 2px; padding: 7px 10px;
  background: var(--surface-2); border-radius: 7px; line-height: 1.45; }
.sp-resolve b { color: var(--text); }
.sp-badge { display: inline-block; font-size: 9px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .06em; padding: 1px 6px; border-radius: 999px; margin: 0 5px; vertical-align: middle; }
.sp-badge.sched { background: var(--accent-bg, rgba(26,79,180,.12)); color: var(--accent); }
.pp-method { margin-top: 18px; padding: 14px 16px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 11px; font-size: 12.5px; color: var(--text-2); line-height: 1.6; }
.pp-method b { color: var(--text); } .pp-method a { color: var(--accent); }

/* ===== front-page "Asset outlooks" band chips ===== */
.ao-chips { display:flex; flex-wrap:wrap; gap:8px; }
.ao-chips a { display:inline-flex; align-items:center; gap:6px; background:var(--surface); border:1px solid var(--border);
  border-left-width:3px; border-radius:999px; padding:6px 13px; font:600 13px var(--sans); color:var(--text); text-decoration:none; }
.ao-chips a:hover { border-color:var(--accent); }
.ao-chips a .b { font-weight:800; }
.ao-chips a.up { border-left-color:var(--green); }   .ao-chips a.up .b { color:var(--green); }
.ao-chips a.down { border-left-color:var(--red); }   .ao-chips a.down .b { color:var(--red); }
.ao-chips a.flat { border-left-color:var(--amber); } .ao-chips a.flat .b { color:var(--amber); }

/* ===== /predictions — horizontal cards + speedometer gauge (pw-*, this page only) ===== */
.predpage2 { margin-top: 8px; }
.pw-lede { color: var(--text-2); max-width: 720px; line-height: 1.55; margin: -2px 0 14px; font-size: 15px; }
.pw-lede b { color: var(--text); }
.pw-lede a { color: var(--accent); font-weight: 700; white-space: nowrap; }
.pw-regime { display: flex; gap: 10px 13px; align-items: baseline; flex-wrap: wrap; background: var(--surface-2);
  border: 1px solid var(--border); border-radius: 10px; padding: 9px 14px; margin: 0 0 18px;
  font-size: 12.5px; color: var(--text-2); line-height: 1.5; }
.pw-regime-k { font: 800 10px var(--sans); text-transform: uppercase; letter-spacing: .09em; color: var(--accent); white-space: nowrap; }
.pw-regime-t { flex: 1; min-width: 220px; }
.pw-asof { color: var(--text-3); white-space: nowrap; font-variant-numeric: tabular-nums; }

.pw-list { display: flex; flex-direction: column; gap: 14px; }
.pw-card { display: grid; grid-template-columns: 1fr 216px; gap: 26px; align-items: center; background: var(--surface);
  border: 1px solid var(--border); border-left-width: 4px; border-radius: 14px; padding: 18px 24px;
  transition: box-shadow .15s ease, transform .15s ease; }
.pw-card:hover { box-shadow: 0 6px 22px rgba(0,0,0,.07); transform: translateY(-1px); }
.pw-card.pw-hi  { border-left-color: var(--green); }
.pw-card.pw-mid { border-left-color: var(--accent); }
.pw-card.pw-lo  { border-left-color: var(--amber); }

/* the speedometer */
.pw-instr { text-align: center; grid-column: 2; grid-row: 1; }
.pw-gauge { width: 200px; max-width: 100%; height: auto; display: block; margin: 0 auto; overflow: visible; }
.pw-g-track { fill: none; stroke: var(--border); stroke-width: 12; stroke-linecap: round; }
.pw-g-val { fill: none; stroke-width: 12; stroke-linecap: round; }
.pw-g-tick { stroke: var(--text-3); stroke-width: 2; opacity: .4; }
.pw-g-needle { stroke: var(--text); stroke-width: 3; stroke-linecap: round; }
.pw-g-hub { fill: var(--text); }
.pw-g-crowd { stroke: var(--text-2); stroke-width: 3; stroke-linecap: round; }
.pw-g-num { font: 800 34px var(--mono, "SF Mono", Menlo, monospace); fill: var(--text); text-anchor: middle;
  font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.pw-g-sym { font-size: 17px; opacity: .6; }
.pw-g-lik { font: 700 9px var(--sans); fill: var(--text-3); text-anchor: middle; letter-spacing: .18em; }
.pw-hi .pw-g-val { stroke: var(--green); }  .pw-hi .pw-g-num { fill: var(--green); }
.pw-mid .pw-g-val { stroke: var(--accent); } .pw-mid .pw-g-num { fill: var(--accent); }
.pw-lo .pw-g-val { stroke: var(--amber); }  .pw-lo .pw-g-num { fill: var(--amber); }
.pw-crowd { font-size: 11px; color: var(--text-3); margin-top: 4px; }
.pw-crowd b { color: var(--text-2); font-variant-numeric: tabular-nums; }
.pw-delta { font-weight: 800; }
.pw-delta.up { color: var(--green); } .pw-delta.down { color: var(--red); }

/* the body */
.pw-body { min-width: 0; grid-column: 1; grid-row: 1; }
.pw-kick { display: flex; align-items: center; gap: 8px; font: 700 11px var(--sans); text-transform: uppercase;
  letter-spacing: .06em; color: var(--text-3); margin-bottom: 5px; }
.pw-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex: none; }
.pw-hi .pw-dot { background: var(--green); } .pw-lo .pw-dot { background: var(--amber); }
.pw-basis { color: var(--accent); }
.pw-hi .pw-basis { color: var(--green); } .pw-lo .pw-basis { color: var(--amber); }
.pw-when { color: var(--text-3); font-weight: 600; letter-spacing: 0; text-transform: none; font-size: 11.5px; }
.pw-when::before { content: "· "; }
.pw-title { font-family: var(--serif, Georgia, serif); font-size: 22px; line-height: 1.18; margin: 0 0 6px;
  font-weight: 700; letter-spacing: -.01em; }
.pw-title a { color: var(--text); } .pw-title a:hover { color: var(--accent); text-decoration: none; }
.pw-claim { font-size: 15px; line-height: 1.5; color: var(--text-2); margin: 0 0 12px; }
.pw-moves { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.pw-moves-k { font: 700 10px var(--sans); text-transform: uppercase; letter-spacing: .08em; color: var(--text-3); margin-right: 2px; }
.pw-moves .gtag { font-size: 12px; padding: 3px 9px; }
.pw-play { font-size: 13.5px; line-height: 1.5; background: var(--surface-2); border-left: 3px solid var(--accent);
  border-radius: 0 8px 8px 0; padding: 9px 13px; }
.pw-hi .pw-play { border-left-color: var(--green); } .pw-lo .pw-play { border-left-color: var(--amber); }
.pw-play b { color: var(--accent); }
.pw-hi .pw-play b { color: var(--green); } .pw-lo .pw-play b { color: var(--amber); }
.pw-more { margin-top: 11px; }
.pw-more > summary { cursor: pointer; font: 700 11px var(--sans); text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-3); list-style: none; display: inline-flex; align-items: center; gap: 6px; }
.pw-more > summary::-webkit-details-marker { display: none; }
.pw-more > summary::before { content: "›"; font-size: 15px; line-height: 1; transition: transform .15s ease; display: inline-block; }
.pw-more[open] > summary::before { transform: rotate(90deg); }
.pw-more > summary:hover { color: var(--accent); }
.pw-more-in { margin-top: 9px; }
.pw-more-in .sp-resolve, .pw-more-in .sp-edge { margin-top: 8px; }
.pw-src { font-size: 11.5px; color: var(--text-3); margin-top: 9px; line-height: 1.5; }
.pw-src a { color: var(--text-2); } .pw-src a:hover { color: var(--accent); }
.pw-foot { margin-top: 11px; }
.pw-dd { font-weight: 700; color: var(--accent); font-size: 13px; }
.pw-method { margin-top: 20px; padding: 14px 16px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 12px; font-size: 13px; color: var(--text-2); line-height: 1.55; }
.pw-method b { color: var(--text); } .pw-method a { color: var(--accent); font-weight: 700; }

@media (max-width: 720px) {
  .pw-card { grid-template-columns: 1fr; gap: 8px; padding: 16px 16px 18px; }
  .pw-instr, .pw-body { grid-column: auto; grid-row: auto; }
  .pw-gauge { width: 172px; }
  .pw-title { font-size: 20px; }
  .pw-regime { flex-direction: column; gap: 5px; }
  .pw-regime-t { min-width: 0; }
  .pw-asof { order: 3; }
}
