/* ============================================================
   AI Act Radar — "The Dispatch"
   Premium editorial broadsheet. Light (default) + dark (evening).
   Self-hosted fonts, no external origins. Strict-CSP safe.
   ============================================================ */

/* ===== SELF-HOSTED FONTS ===== */
@font-face{
  font-family:"Fraunces";
  src:url("/static/fonts/fraunces-full.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Fraunces";
  src:url("/static/fonts/fraunces-italic.woff2") format("woff2");
  font-weight:100 900; font-style:italic; font-display:swap;
}
@font-face{
  font-family:"Newsreader";
  src:url("/static/fonts/newsreader-full.woff2") format("woff2");
  font-weight:200 800; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Newsreader";
  src:url("/static/fonts/newsreader-italic.woff2") format("woff2");
  font-weight:200 800; font-style:italic; font-display:swap;
}
@font-face{
  font-family:"Spline Sans Mono";
  src:url("/static/fonts/spline-sans-mono.woff2") format("woff2");
  font-weight:300 700; font-style:normal; font-display:swap;
}

/* ===== PALETTE — MORNING EDITION (default light) ===== */
:root{
  --bg:#F7F4ED; --raised:#FFFDF8; --ink:#1A1714; --ink-muted:#5C544B;
  --rule:#DAD2C4; --accent:#9A1B1B; --link:#1B4D6B;
  --comp:#1B5E4B; --bind:#1B4D6B; --prop:#B5651D; --guid:#7A5BA6; --none:#D9D0C2;
  --comp-soft:#E2EEE9; --bind-soft:#E1E9EF; --prop-soft:#F2E7D9; --guid-soft:#ECE5F2;
  /* darker text-only tokens for SMALL words on soft backgrounds (≥4.5:1 in light) */
  --prop-ink:#8A4A10; --guid-ink:#5C4486;
  --display:"Fraunces",Georgia,serif;
  --body:"Newsreader",Georgia,serif;
  --mono:"Spline Sans Mono",ui-monospace,monospace;
  --maxw:1200px;
}
/* ===== EVENING EDITION (dark) ===== */
html[data-theme="dark"]{
  --bg:#15120E; --raised:#1E1A15; --ink:#EDE6D8; --ink-muted:#A89B86;
  --rule:#473F33; --accent:#E0584F; --link:#7FB3CE;
  --comp:#3FA585; --bind:#5B9BC4; --prop:#D58B45; --guid:#A98BD4; --none:#3A332A;
  --comp-soft:#1C2A26; --bind-soft:#1A262E; --prop-soft:#2C2418; --guid-soft:#241E2E;
  /* dark theme already passes — small-text tokens mirror the bright hues */
  --prop-ink:#D58B45; --guid-ink:#A98BD4;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--body); font-size:16px; line-height:1.55;
  font-optical-sizing:auto; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px}
a{color:var(--link); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:2px}
.mono{font-family:var(--mono); font-feature-settings:"tnum" 1; letter-spacing:.01em}
.up{text-transform:uppercase; letter-spacing:.12em}

/* visible focus everywhere */
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,
[tabindex]:focus-visible,.cy:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px; border-radius:1px;
}
svg.aiar-map .cy:focus{outline:none}
/* only the interactive (focusable) country paths get a visible focus ring;
   outline is removed on the SVG so use stroke instead */
svg.aiar-map .cy[tabindex="0"]:focus-visible{
  outline:none; stroke:var(--accent); stroke-width:2.4px;
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:50;background:var(--ink);color:var(--bg);
  font-family:var(--mono);font-size:12px;padding:9px 14px}
.skip-link:focus{left:8px;top:8px}

/* ===== TOP THIN BAR ===== */
.topbar{border-bottom:1px solid var(--ink); background:var(--bg)}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:34px; flex-wrap:wrap; padding-top:5px; padding-bottom:5px}
.topbar .mono{font-size:11px; color:var(--ink-muted)}
.topbar nav{display:flex; gap:18px; flex-wrap:wrap}
.topbar nav a{font-family:var(--mono); font-size:11px; color:var(--ink); text-transform:uppercase; letter-spacing:.08em}
.theme-toggle{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.08em;
  background:none; border:none; color:var(--ink); cursor:pointer; padding:2px 0}
.theme-toggle:hover{color:var(--accent)}
.topbar .verified{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;
  color:var(--ink-muted);text-transform:uppercase;letter-spacing:.07em}
.topbar .verified .vc{color:var(--comp)}
.topbar .livestat{color:var(--accent)}
.topbar .livestat .pulse{width:7px;height:7px}

/* ===== MASTHEAD ===== */
.masthead{border-bottom:3px double var(--ink)}
.masthead .wrap{padding-top:18px; padding-bottom:16px}
.masthead-band{display:flex; align-items:flex-end; justify-content:space-between; gap:20px}
.brand{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap}
.brand-link{color:inherit; text-decoration:none}
.brand-link:hover{text-decoration:none}
.brand .wordmark{
  font-family:var(--display); font-optical-sizing:auto;
  font-variation-settings:"opsz" 144,"wght" 600;
  font-weight:600; font-size:56px; line-height:.92; letter-spacing:-.02em;
  margin:0; color:var(--ink); display:inline-block;
}
.brand .seal{font-family:var(--mono); font-size:11px; color:var(--ink-muted); text-transform:uppercase;
  letter-spacing:.1em; border:1px solid var(--rule); padding:3px 8px; border-radius:2px; white-space:nowrap}
.dateline{display:flex; flex-direction:column; align-items:flex-end; gap:5px; text-align:right}
.dateline .mono{font-size:11px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.09em}
.live{display:inline-flex; align-items:center; gap:7px; font-family:var(--mono); font-size:11px;
  color:var(--accent); text-transform:uppercase; letter-spacing:.09em; font-weight:500}
.pulse{width:8px; height:8px; border-radius:50%; background:var(--accent); display:inline-block; flex:none}
.dateline .verified{color:var(--comp)}

/* ===== FOLD GRID ===== */
.fold{display:grid; grid-template-columns:7fr 5fr; gap:0; border-bottom:1px solid var(--ink)}
.fold-left{padding:30px 34px 30px 0; border-right:1px solid var(--rule)}
.fold-right{padding:30px 0 30px 34px}

.lede-kicker{font-family:var(--display); font-style:italic; font-weight:500; font-size:20px; color:var(--accent); margin:0 0 14px}
.headline{
  font-family:var(--display); font-optical-sizing:auto;
  font-variation-settings:"opsz" 144,"wght" 600;
  font-weight:600; font-size:46px; line-height:1.02; letter-spacing:-.015em;
  margin:0 0 18px; color:var(--ink);
}
.standfirst{font-size:18px; line-height:1.5; color:var(--ink-muted); margin:0 0 26px; max-width:54ch}
.standfirst .nb{color:var(--ink); font-style:italic}

/* exposure figure */
.exposure{border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); padding:22px 0; margin:0 0 26px}
.exposure-line{display:flex; align-items:baseline; gap:18px; flex-wrap:wrap}
.bignum{
  font-family:var(--display); font-optical-sizing:auto;
  font-variation-settings:"opsz" 144,"wght" 600;
  font-weight:600; font-size:92px; line-height:.8; letter-spacing:-.03em; color:var(--accent);
  font-feature-settings:"tnum" 1;
}
.exposure-text{font-family:var(--display); font-variation-settings:"opsz" 60,"wght" 500;
  font-size:31px; line-height:1.08; color:var(--ink); max-width:20ch}
.exposure-text b{font-weight:600; color:var(--accent); white-space:nowrap}
.exposure.demo .bignum{color:var(--ink)}
.exposure-meta{margin-top:14px; font-family:var(--mono); font-size:12px; color:var(--ink-muted); line-height:1.6}
.exposure-meta .chip-on{color:var(--ink); border-bottom:1px solid var(--accent)}
.demo-flag{display:inline-block;font-family:var(--mono);font-style:normal;font-size:11px;text-transform:uppercase;
  letter-spacing:.1em;color:var(--prop-ink);border:1px solid var(--prop);padding:2px 7px;border-radius:2px;margin-right:9px}
.exposure:not(.demo) .demo-flag{display:none}

/* profile controls */
.controls{margin:0 0 4px}
.ctrl-row{margin:0 0 14px}
.ctrl-label{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-muted); margin:0 0 8px}
.chips{display:flex; flex-wrap:wrap; gap:7px}
.chip{font-family:var(--mono); font-size:12px; padding:5px 11px; border:1px solid var(--rule);
  border-radius:2px; background:var(--raised); color:var(--ink-muted); cursor:pointer; line-height:1.2}
.chip:hover{border-color:var(--ink-muted)}
.chip[aria-pressed="true"]{background:var(--ink); color:var(--bg); border-color:var(--ink)}
.chip.more{border-style:dashed}

/* ===== MAP ===== */
/* Stack title over credit at ALL widths: the fold-right column is narrow (5/12),
   so a one-row title + nowrap credit crushed the serif title into a ragged
   column at laptop widths too — not just on phones. */
.map-head{display:flex; flex-direction:column; align-items:flex-start; gap:3px; margin:0 0 9px}
.map-title{font-family:var(--display); font-variation-settings:"opsz" 40,"wght" 600; font-weight:600; font-size:20px; margin:0}
.map-credit{font-family:var(--mono); font-size:10.5px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.07em; white-space:nowrap}
.map-frame{position:relative; border:1px solid var(--rule); background:var(--raised); padding:10px 12px; min-height:60px}
/* pan/zoom/expand controls — flush top-right, monospaced, no shadow */
.map-tools{position:absolute; top:8px; right:8px; z-index:4; display:flex; gap:4px}
.mtool{font-family:var(--mono); font-size:12.5px; line-height:1; padding:5px 8px; min-width:27px;
  background:var(--bg); color:var(--ink-muted); border:1px solid var(--rule); cursor:pointer;
  letter-spacing:.04em; transition:color .12s, border-color .12s}
.mtool:hover{color:var(--ink); border-color:var(--ink)}
.mtool:focus-visible{outline:2px solid var(--accent); outline-offset:1px; color:var(--ink)}
.mtool-exp{text-transform:uppercase; font-size:10px; letter-spacing:.08em}
/* expanded = near-fullscreen modal view; scrim via box-shadow (no extra DOM) */
.map-frame.expanded{position:fixed; inset:max(14px,3vh) max(14px,3vw); z-index:200;
  background:var(--bg); overflow:auto; box-shadow:0 0 0 100vmax rgba(0,0,0,.5)}
.map-frame.expanded #map{display:flex; align-items:center; justify-content:center; min-height:100%}
.map-frame.expanded svg.aiar-map{max-height:calc(100vh - 40px)}
body.map-locked{overflow:hidden}
.map-caption{font-family:var(--body); font-style:italic; font-size:14px; color:var(--ink-muted); margin:10px 2px 0; line-height:1.4}
.map-footprint{font-family:var(--mono);font-size:11px;color:var(--ink-muted);margin:8px 2px 0}
.map-footprint b{color:var(--accent)}

svg.aiar-map{width:100%; height:auto; display:block}
svg.aiar-map .cy{stroke:var(--rule); stroke-width:.5px; vector-effect:non-scaling-stroke; cursor:pointer}
svg.aiar-map .cy[data-status="comp"]{fill:url(#pat-comp)}
svg.aiar-map .cy[data-status="bind"]{fill:url(#pat-bind)}
svg.aiar-map .cy[data-status="prop"]{fill:url(#pat-prop)}
svg.aiar-map .cy[data-status="guid"]{fill:url(#pat-guid)}
svg.aiar-map .cy[data-status="none"]{fill:var(--none); opacity:.55}
/* dark theme: 'none' over near-black nearly vanished — explicit lighter fill */
html[data-theme="dark"] svg.aiar-map .cy[data-status="none"]{fill:#2C2720; opacity:.9}
svg.aiar-map .cy.in-foot{stroke:var(--ink); stroke-width:1.1px}
svg.aiar-map .cy.sel{stroke:var(--accent); stroke-width:1.8px}
/* EU bloc — the editorial anchor: a genuinely double-ruled OUTLINE, but a
   NEUTRAL one (ink, not accent). It marks the bloc boundary the caption
   promises without reading as "selected". The accent only appears when the
   EU is actually in your footprint or clicked (see .in-foot / .sel below). */
svg.aiar-map .cy.eu-bloc{
  stroke:var(--ink); stroke-width:2.2px; vector-effect:non-scaling-stroke;
  paint-order:stroke;
  filter:drop-shadow(0 0 1px var(--raised)) drop-shadow(0 0 1.5px var(--ink));
}
svg.aiar-map .cy.eu-bloc.in-foot,
svg.aiar-map .cy.eu-bloc.sel{
  stroke-width:3px;
  filter:drop-shadow(0 0 1px var(--raised)) drop-shadow(0 0 1.8px var(--accent));
}
svg.aiar-map circle.mk{stroke:var(--raised); stroke-width:1px}
svg.aiar-map circle.mk[data-status="comp"]{fill:var(--comp)}
svg.aiar-map circle.mk[data-status="bind"]{fill:var(--bind)}
svg.aiar-map circle.mk[data-status="prop"]{fill:var(--prop)}
svg.aiar-map circle.mk[data-status="guid"]{fill:var(--guid)}
svg.aiar-map circle.mk[data-status="none"]{fill:var(--none)}
svg.aiar-map path.aiar-sphere{fill:var(--raised); stroke:var(--rule); stroke-width:1px}
svg.aiar-map path.aiar-graticule{fill:none; stroke:var(--rule); stroke-width:.5px; opacity:.6}
.map-fallback{font-family:var(--mono); font-size:12px; color:var(--ink-muted); text-align:center; padding:48px 12px; border:1px dashed var(--rule)}

/* legend */
.legend{display:flex; flex-wrap:wrap; gap:0; margin:14px 0 0; border-top:1px solid var(--rule)}
.leg-item{display:flex; align-items:center; gap:9px; padding:9px 14px 9px 0; flex:1 1 45%; min-width:160px;
  background:none;border:none;text-align:left;cursor:pointer;font:inherit}
.leg-item.off{opacity:.4}
.leg-item.leg-static{cursor:default}
.leg-label{font-family:var(--mono); font-size:12px; color:var(--ink); line-height:1.25}
.leg-label .ct{color:var(--ink-muted)}

/* legend swatches — SAME pattern ids as the map fills, so legend == map */
.sw{width:22px;height:14px;flex:none;border:1px solid var(--rule);display:inline-block}
.sw-comp{fill:url(#pat-comp)}
.sw-bind{fill:url(#pat-bind)}
.sw-prop{fill:url(#pat-prop)}
.sw-guid{fill:url(#pat-guid)}
.sw-none{background:var(--none); opacity:.6}

/* ===== NEXT DEADLINES STRIP ===== */
.deadlines{border-bottom:1px solid var(--ink)}
.deadlines .wrap{padding:16px 28px}
.dl-head{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--ink-muted); margin:0 0 12px}
.dl-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:0}
.dl{padding:0 22px; border-left:1px solid var(--rule)}
.dl:first-child{padding-left:0; border-left:none}
.dl-juris{font-family:var(--mono); font-size:11px; color:var(--link); text-transform:uppercase; letter-spacing:.06em; margin:0 0 6px}
.dl-title{font-family:var(--body); font-size:16px; line-height:1.25; color:var(--ink); margin:0 0 10px}
.dl-foot{display:flex; align-items:baseline; justify-content:space-between; gap:8px}
.dl-date{font-family:var(--mono); font-size:11.5px; color:var(--ink-muted)}
.dl-t{font-family:var(--mono); font-size:11.5px; font-weight:500; color:var(--accent)}
.dl-t.far{color:var(--ink-muted)}
.dl-empty{font-family:var(--body);font-style:italic;font-size:15px;color:var(--ink-muted)}

/* ===== INDEX (stories) ===== */
.index-wrap{padding:28px 0 10px}
.index-grid{display:grid; grid-template-columns:8fr 4fr; gap:0}
.stories{padding-right:36px; border-right:1px solid var(--rule)}
.sidebar{padding-left:32px}
.section-rule{display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; border-bottom:2px solid var(--ink); padding-bottom:8px; margin:0 0 4px}
.section-rule h2{font-family:var(--display); font-variation-settings:"opsz" 40,"wght" 600; font-weight:600; font-size:25px; margin:0; letter-spacing:-.01em}
.section-rule .sub{font-family:var(--mono); font-size:11px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.08em}

/* register controls */
.register-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:14px 0 18px}
.seg{display:flex;border:1px solid var(--rule);border-radius:2px;overflow:hidden}
.seg button{background:var(--raised);border:none;border-right:1px solid var(--rule);color:var(--ink-muted);
  font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:7px 12px;cursor:pointer}
.seg button:last-child{border-right:none}
.seg button[aria-current="true"]{background:var(--ink);color:var(--bg)}
.sortwrap{display:flex;align-items:center;gap:8px}
.sortwrap label{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-muted)}
.sortsel{background:var(--raised);border:1px solid var(--rule);border-radius:2px;color:var(--ink);
  font-family:var(--mono);font-size:11.5px;padding:7px 10px;cursor:pointer}
.register-controls .sp{flex:1}
.rescount{font-family:var(--mono);font-size:11.5px;color:var(--ink-muted)}

/* active-filter bar */
.selbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 18px;font-family:var(--mono);
  font-size:11px;color:var(--ink-muted)}
.selbar .selpill{display:inline-flex;align-items:center;gap:7px;background:var(--raised);border:1px solid var(--rule);
  color:var(--ink);padding:4px 9px;border-radius:2px}
.selbar .selpill b{font-weight:500;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.06em;font-size:10px}
.selbar .selpill .x{color:var(--ink-muted);cursor:pointer;border:none;background:none;font:inherit;padding:0;line-height:1}
.selbar .selpill .x:hover{color:var(--accent)}
.selbar .clr{color:var(--link);text-decoration:underline;cursor:pointer;border:none;background:none;font:inherit}

.story{padding:18px 0; border-top:1px solid var(--rule)}
.story:first-of-type{border-top:none; padding-top:0}
.story-top{display:flex; align-items:center; gap:10px; margin:0 0 9px; flex-wrap:wrap}
.tag{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--link)}
.pill{font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.05em;
  padding:2px 8px; border-radius:2px; border:1px solid; line-height:1.4; display:inline-flex; align-items:center; gap:5px}
.pill .gl{font-size:10px;line-height:1}
.pill-comp{color:var(--comp); border-color:var(--comp); background:var(--comp-soft)}
.pill-bind{color:var(--bind); border-color:var(--bind); background:var(--bind-soft)}
.pill-prop{color:var(--prop-ink); border-color:var(--prop); background:var(--prop-soft)}
.pill-guid{color:var(--guid-ink); border-color:var(--guid); background:var(--guid-soft)}
.pill-none{color:var(--ink-muted); border-color:var(--rule); background:var(--raised)}

.story h3{font-family:var(--display); font-variation-settings:"opsz" 40,"wght" 600; font-weight:600;
  font-size:25px; line-height:1.1; letter-spacing:-.01em; margin:0 0 8px; color:var(--ink)}
.story h3 a{color:inherit}
.standf{font-size:16.5px; line-height:1.45; color:var(--ink-muted); margin:0 0 8px; max-width:62ch}
.standf b{color:var(--ink); font-weight:600}
.applies-to{font-family:var(--mono);font-size:11px;color:var(--comp);margin:0 0 10px}
.applies-to::before{content:"▸ ";color:var(--accent)}
.story-foot{display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  font-family:var(--mono); font-size:11.5px; color:var(--ink-muted)}
.story-foot .when{color:var(--ink); font-weight:500}
.story-foot .checked{display:inline-flex; align-items:center; gap:5px}
.story-foot .checked .vc{color:var(--comp)}
.conf{display:inline-flex; align-items:center; gap:5px; text-transform:uppercase; letter-spacing:.05em}
.conf .dot{width:6px; height:6px; border-radius:50%; flex:none}
.conf-high .dot{background:var(--comp)} .conf-high{color:var(--comp)}
.conf-medium .dot{background:var(--prop)} .conf-medium{color:var(--prop-ink)}
.conf-low .dot{background:var(--accent)} .conf-low{color:var(--accent)}
.src-link{color:var(--link)}
.list-empty{font-family:var(--body);font-style:italic;font-size:16px;color:var(--ink-muted);
  padding:26px 0;border-top:1px solid var(--rule)}

/* sidebar blocks */
.sb-block{margin:0 0 30px}
.sb-head{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--ink-muted); border-bottom:1px solid var(--ink); padding-bottom:7px; margin:0 0 14px}
.export-row{display:flex; flex-direction:column; gap:8px}
.btn{font-family:var(--mono); font-size:12.5px; text-align:left; padding:11px 14px; border:1px solid var(--ink);
  background:var(--raised); color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:10px; border-radius:2px; width:100%}
.btn:hover{background:var(--ink); color:var(--bg)}
.btn .ar{font-size:13px}
.btn-ghost{border-style:dashed; border-color:var(--rule); color:var(--ink-muted)}
.btn-ghost:hover{background:var(--rule); color:var(--ink)}
.export-note{font-family:var(--mono);font-size:11px;color:var(--comp);margin:10px 0 0;min-height:1.2em}

/* email capture */
.subscribe{margin:18px 0 0}
.subscribe label{display:block;font-family:var(--body);font-size:14.5px;color:var(--ink);margin:0 0 9px;line-height:1.4}
.sub-row{display:flex;gap:8px;flex-wrap:wrap}
.subscribe input[type=email]{flex:1;min-width:140px;background:var(--raised);border:1px solid var(--rule);
  color:var(--ink);font-family:var(--mono);font-size:12.5px;padding:10px 11px;border-radius:2px}
.subscribe input[type=email]::placeholder{color:var(--ink-muted)}
.subscribe button{background:var(--ink);color:var(--bg);border:1px solid var(--ink);font-family:var(--mono);
  font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding:10px 14px;border-radius:2px;cursor:pointer;white-space:nowrap}
.subscribe button:hover{background:var(--accent);border-color:var(--accent)}
.sub-note{font-family:var(--mono);font-size:11px;color:var(--ink-muted);margin:9px 0 0;min-height:1.2em}
.sub-note.ok{color:var(--comp)}
.sub-note.warn{color:var(--prop)}

/* partner ad slots */
.ad-slot{border:1px solid var(--rule);padding:16px;background:var(--raised)}
.ad-slot[hidden]{display:none}
.partner .lbl{font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.16em; color:var(--ink-muted); margin:0 0 12px; display:flex; align-items:center; gap:8px}
.partner .lbl::after{content:""; flex:1; height:1px; background:var(--rule)}

.howverify{font-family:var(--body); font-size:15px; line-height:1.5; color:var(--ink-muted)}
.howverify p{margin:0 0 10px}
.howverify em{color:var(--ink);font-style:italic}
.howverify .stamp{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--comp); border:1px solid var(--comp); padding:4px 9px; border-radius:2px; display:inline-block}

/* ===== FOOTER ===== */
footer{border-top:3px double var(--ink); margin-top:20px}
footer .wrap{padding:22px 28px 40px; display:flex; align-items:flex-start; justify-content:space-between; gap:24px; flex-wrap:wrap}
.foot-note{font-family:var(--body); font-style:italic; font-size:15px; color:var(--ink-muted); max-width:46ch; margin:8px 0 0}
.foot-note a{color:var(--link)}
.foot-nav{display:flex; gap:20px; flex-wrap:wrap}
.foot-nav a{font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--ink)}
.foot-brand{font-family:var(--display); font-variation-settings:"opsz" 40,"wght" 600; font-weight:600; font-size:18px; color:var(--ink); margin:0}

/* ===== TOOLTIP ===== */
.tip{position:fixed; pointer-events:none; background:var(--raised); border:1px solid var(--ink);
  padding:13px 14px; width:262px; opacity:0; transition:opacity .1s; z-index:30; box-shadow:none; border-radius:2px}
.tip .nm{font-family:var(--display); font-variation-settings:"opsz" 30,"wght" 600; font-weight:600; font-size:16px;
  display:flex; align-items:baseline; justify-content:space-between; gap:8px; color:var(--ink)}
.tip .you{font-family:var(--mono); font-size:9px; text-transform:uppercase; letter-spacing:.06em; color:var(--accent);
  border:1px solid var(--accent); padding:2px 5px; border-radius:2px; white-space:nowrap}
.tip .stt{display:flex; align-items:center; gap:7px; margin-top:8px; font-family:var(--mono); font-size:12px; color:var(--ink)}
.tip .stt .gl{font-size:11px}
.tip .ob{font-family:var(--mono); font-size:11px; color:var(--ink-muted); margin-top:8px; line-height:1.45}
.tip .nx{font-family:var(--mono); font-size:11px; color:var(--accent); margin-top:4px}
.tip .nx.dim{color:var(--ink-muted)}
.tip .nx.live-in-force{color:var(--comp)}
.tip .law{font-family:var(--body); font-size:12.5px; line-height:1.4; color:var(--ink-muted); margin-top:9px; padding-top:9px; border-top:1px solid var(--rule)}
.tip .ck{font-family:var(--mono); font-size:10px; color:var(--ink-muted); margin-top:7px}
.tip .af{font-family:var(--mono); font-size:10.5px; color:var(--link); margin-top:8px}
.tip .af.dim{color:var(--ink-muted)}

/* ===== NOSCRIPT ===== */
.noscript{border:1px solid var(--prop);background:var(--prop-soft);color:var(--ink);
  padding:14px 16px;margin:16px 0;font-family:var(--body);font-size:15px;line-height:1.5}
.noscript a{color:var(--link);font-weight:600}

/* ===== MOTION ===== */
@media (prefers-reduced-motion: no-preference){
  .pulse{animation:breathe 2.4s ease-in-out infinite}
  @keyframes breathe{0%,100%{opacity:1; transform:scale(1)} 50%{opacity:.35; transform:scale(.7)}}
}

/* ===== RESPONSIVE ===== */
@media (max-width:920px){
  .fold{grid-template-columns:1fr}
  .fold-left{border-right:none; border-bottom:1px solid var(--rule); padding:24px 0}
  .fold-right{padding:24px 0}
  .index-grid{grid-template-columns:1fr}
  .stories{padding-right:0; border-right:none}
  .sidebar{padding-left:0; margin-top:36px; border-top:2px solid var(--ink); padding-top:24px}
  .dl-grid{grid-template-columns:1fr 1fr}
  .dl{padding:14px 0 0 18px}
  .dl:nth-child(odd){padding-left:0; border-left:none}
  .dl:nth-child(2){border-left:1px solid var(--rule)}
}
@media (max-width:560px){
  .wrap{padding:0 18px}
  /* keep the nav visible on mobile (no hidden navigation); drop it to its own
     full-width row that wraps, and hide the redundant issue label to make room */
  #issueNo{display:none}
  .topbar nav{display:flex; order:3; width:100%; justify-content:flex-start;
    gap:14px; border-top:1px solid var(--rule); margin-top:3px; padding-top:6px}
  .topbar nav a{font-size:10.5px; letter-spacing:.05em}
  .brand .wordmark{font-size:38px}
  .headline{font-size:32px}
  .bignum{font-size:68px}
  .exposure-text{font-size:24px}
  .exposure-line{gap:12px}
  .dl-grid{grid-template-columns:1fr}
  .dl{padding:14px 0 0; border-left:none !important}
  .dl+.dl{border-top:1px solid var(--rule); padding-top:14px}
  .story h3{font-size:21px}
  .section-rule h2{font-size:21px}
  .masthead-band{flex-direction:column; align-items:flex-start; gap:12px}
  .dateline{align-items:flex-start; text-align:left}
  /* the nowrap credit was crushing the serif map title into a ragged 4-line
     column — stack them so the title gets the full width (1–2 clean lines). */
  .map-head{flex-direction:column; align-items:flex-start; gap:3px; margin-bottom:9px}
  .map-credit{white-space:normal}
}

/* ============================================================
   CONTENT PAGES — generated by bin/aiar-build.js
   (jurisdiction dossiers, directory, changelog, methodology,
    about, 404). Reuses the broadsheet chrome above; these
    classes style the article body. No cards, no shadows.
   ============================================================ */
.page{padding:26px 0 10px}
.page .brand a{color:inherit}

/* breadcrumbs */
.crumbs{font-size:11px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.07em; margin:0 0 22px}
.crumbs a{color:var(--ink-muted)}
.crumbs a:hover{color:var(--accent)}
.crumbs [aria-current="page"]{color:var(--ink)}
.crumbs span[aria-hidden]{margin:0 4px; color:var(--rule)}

/* page header block */
.page-head{margin:0 0 30px; border-bottom:1px solid var(--ink); padding-bottom:24px}
.page-h1{font-family:var(--display); font-optical-sizing:auto;
  font-variation-settings:"opsz" 144,"wght" 600; font-weight:600;
  font-size:44px; line-height:1.03; letter-spacing:-.018em; margin:0 0 14px; color:var(--ink)}

/* jurisdiction meta strip */
.jur-meta{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin:6px 0 0}
.jm-law{font-family:var(--body); font-size:15.5px; color:var(--ink-muted)}
.jm-law b{color:var(--ink); font-weight:600}
.jur-note{font-family:var(--body); font-style:italic; font-size:15px; color:var(--ink-muted); margin:12px 0 0; max-width:64ch}
.checked-line{margin:14px 0 0}

/* prose pages (methodology / about / 404) */
.prose section{margin:0 0 26px}
.prose p{font-size:17px; line-height:1.6; color:var(--ink); max-width:68ch; margin:0 0 14px}
.prose p.legal{color:var(--ink-muted); font-style:italic}
.prose .section-rule{margin-bottom:14px}
.prose a{color:var(--link)}

/* directory table */
.table-wrap{margin:18px 0 4px; overflow-x:auto}
.jr-table{width:100%; border-collapse:collapse; font-family:var(--body)}
.jr-table th{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--ink-muted); text-align:left; border-bottom:2px solid var(--ink); padding:0 14px 9px 0; white-space:nowrap}
.jr-table td{border-bottom:1px solid var(--rule); padding:13px 14px 13px 0; vertical-align:top; font-size:15.5px}
.jr-table tr:hover td{background:var(--raised)}
.jr-name a{font-family:var(--display); font-variation-settings:"opsz" 30,"wght" 600; font-weight:600; font-size:18px; color:var(--ink)}
.jr-law{color:var(--ink-muted); font-size:14.5px; max-width:34ch}
.jr-num{text-align:right; color:var(--ink); white-space:nowrap}
.jr-next{color:var(--accent); white-space:nowrap}
th.jr-num,td.jr-num,th.jr-next,td.jr-next{text-align:right}

/* the register on a jurisdiction page */
.register{margin:14px 0 30px}
.register .story:first-of-type{border-top:1px solid var(--rule); padding-top:18px}
.reg-sub{font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.1em;
  color:var(--accent); margin:26px 0 2px; padding-bottom:6px; border-bottom:1px solid var(--rule)}
.register .story:first-of-type{border-top:none}
.reg-sub + .story{border-top:none; padding-top:14px}
.penalty{font-family:var(--mono); font-size:11.5px; color:var(--ink-muted); margin:0 0 8px}
.penalty b{color:var(--ink); font-weight:500}

/* FAQ */
.faq{margin:30px 0 0}
.faq-item{padding:16px 0; border-top:1px solid var(--rule)}
.faq-item:first-of-type{border-top:none}
.faq-q{font-family:var(--display); font-variation-settings:"opsz" 30,"wght" 600; font-weight:600;
  font-size:19px; line-height:1.2; margin:0 0 7px; color:var(--ink)}
.faq-a{font-family:var(--body); font-size:16px; line-height:1.5; color:var(--ink-muted); margin:0; max-width:66ch}

/* changelog page */
.changelog{margin:18px 0 24px}
.cl-entry{padding:22px 0; border-top:1px solid var(--rule)}
.cl-entry:first-of-type{border-top:none}
.cl-top{display:flex; align-items:center; gap:12px; margin:0 0 8px}
.cl-date{font-size:12px; color:var(--ink); font-weight:500; letter-spacing:.02em}
.cl-kind{font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em;
  padding:2px 8px; border-radius:2px; border:1px solid var(--rule); color:var(--ink-muted)}
.kind-add{color:var(--comp); border-color:var(--comp); background:var(--comp-soft)}
.kind-update{color:var(--bind); border-color:var(--bind); background:var(--bind-soft)}
.kind-remove{color:var(--accent); border-color:var(--accent)}
.kind-fix{color:var(--prop); border-color:var(--prop); background:var(--prop-soft)}
.cl-title{font-family:var(--display); font-variation-settings:"opsz" 40,"wght" 600; font-weight:600;
  font-size:23px; line-height:1.12; letter-spacing:-.01em; margin:0 0 8px; color:var(--ink)}
.cl-body{font-family:var(--body); font-size:16.5px; line-height:1.5; color:var(--ink-muted); margin:0 0 10px; max-width:66ch}
.affected{list-style:none; margin:0 0 8px; padding:0; display:flex; flex-direction:column; gap:5px}
.affected li{font-family:var(--body); font-size:14.5px}
.affected .aff-reg{font-size:10.5px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.05em; margin-left:6px}
.cl-src{margin:0; font-family:var(--mono); font-size:11.5px}
.cl-subscribe{font-family:var(--body); font-size:16px; color:var(--ink-muted); margin:8px 0 18px;
  border-top:1px solid var(--rule); padding-top:18px}

/* methodology scale list */
.scale-list{list-style:none; margin:6px 0 14px; padding:0; display:flex; flex-direction:column; gap:10px}
.scale-list li{display:flex; align-items:center; gap:12px; font-size:16px}
.scale-list b{font-weight:600; color:var(--ink)}

/* 404 + shared footers */
.error-page .err-links{list-style:none; margin:8px 0 18px; padding:0; display:flex; flex-direction:column; gap:10px}
.error-page .err-links a{font-family:var(--display); font-variation-settings:"opsz" 30,"wght" 500; font-size:18px}
.legal{font-family:var(--mono); font-size:11.5px; color:var(--ink-muted); letter-spacing:.02em; margin:24px 0 0}
.backlink{font-family:var(--mono); font-size:12px; margin:26px 0 8px}
.backlink a{color:var(--accent)}

@media (max-width:560px){
  .page-h1{font-size:31px}
  .prose p{font-size:16px}
  .jr-law{max-width:none}
}