:root{
  --font-sans:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
  --maxw:1240px;
}

/* MO-001: universal motion-reduce reset (engine-ui-spec.md §3.6) */
@media (prefers-reduced-motion: reduce){*,*::before,*::after{transition-duration:0.01ms !important;animation-duration:0.01ms !important;animation-iteration-count:1 !important;scroll-behavior:auto !important}}
:root{
  --bp-mobile-max: 767.98px;   /* phone breakpoint upper bound; tablet starts at 768 */
  --bp-tablet-max: 1023.98px;  /* iPad-portrait band; landscape starts at 1024 */
}
/* NOTE: CSS custom properties are NOT consumable inside @media expressions.
   The vars above are documentation anchors only — engine-ui-spec.md v2.0 §3.6 */
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--body-font);font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
h1,h2,h3,h4,h5{font-family:var(--head-font);line-height:1.2;color:var(--ink)}
a{color:var(--brand-2);text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
img{max-width:100%}

/* utility bar */
.util{background:var(--util-bg);color:var(--util-ink);font-size:12px;border-bottom:1px solid var(--util-line)}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:36px;gap:10px}
.util .badges span{margin-right:14px;opacity:.85}
@media(max-width:680px){.util .badges{display:none}}

/* prominent theme switcher */
.themebar{display:flex;align-items:center;gap:8px}
.themebar .lbl{font-size:11px;letter-spacing:.12em;opacity:.7;text-transform:uppercase}
.themebar .opts{display:flex;gap:0;border:1px solid var(--util-line);border-radius:30px;overflow:hidden}
.themebar button{font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;border:0;background:transparent;
  color:var(--util-ink);padding:5px 14px;transition:.2s}
.themebar button.on{background:var(--brand);color:#fff}
[data-theme="terminal"] .themebar button.on{color:#04110d}

/* header */
header.site{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
header.site .wrap{display:flex;align-items:center;gap:24px;height:64px}
.logo{font-family:var(--head-font);font-weight:800;font-size:20px;color:var(--ink);white-space:nowrap}
.logo b{color:var(--brand)} .logo small{display:block;font-size:10px;letter-spacing:.18em;color:var(--ink-soft);
  font-family:var(--font-sans);font-weight:600}
nav.main{display:flex;gap:3px;flex:1;flex-wrap:wrap}
nav.main a{padding:8px 11px;border-radius:var(--radius);font-size:14px;color:var(--ink-soft);font-weight:600;transition:.15s}
nav.main a:hover,nav.main a.active{background:var(--surface-2);color:var(--brand)}
.btn{display:inline-block;padding:9px 16px;border-radius:var(--radius);font-weight:700;font-size:14px;cursor:pointer;
  border:1px solid transparent;transition:.15s}
.btn-primary{background:var(--brand);color:#fff} .btn-primary:hover{background:var(--brand-2)}
[data-theme="terminal"] .btn-primary{color:#04110d}
.btn-ghost{border-color:var(--line);color:var(--ink);background:transparent} .btn-ghost:hover{background:var(--surface-2)}
/* btn-primary-mobile: desktop hidden; mobile-only block declared in @media(max-width:767.98px) */
a.btn-primary-mobile{display:none}

/* hero */
.hero{background:var(--hero-bg);color:var(--hero-ink);padding:54px 0 46px}
.hero h1{color:var(--hero-ink);font-size:42px;max-width:760px}
.hero p{max-width:660px;margin:16px 0 24px;font-size:17px;opacity:.92}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .cta .btn-primary{background:var(--hero-btn-bg);color:var(--hero-btn-ink)}
.hero .cta .btn-ghost{border-color:var(--hero-ghost-line);color:var(--hero-ink)}
/* .trust retired UX-2026-07-07 — replaced by .hero-stat-strip */

/* grids/cards */
.grid{display:grid;gap:16px}
.g6,.g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(4,1fr)} .g2{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.g6,.g3,.g4,.g2{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.g6,.g3,.g4,.g2{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.card h3{font-size:16px;margin-bottom:6px} .card p{font-size:13.5px;color:var(--ink-soft)}
.card .dom{font-size:11px;letter-spacing:.12em;color:var(--accent);font-family:var(--font-mono);font-weight:700}
.sec{margin:42px 0 16px} .sec h2{font-size:26px} .sec .sub{color:var(--ink-soft);font-size:14px;margin-top:4px}

/* badges */
.badge{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:20px;
  font-family:var(--font-mono);letter-spacing:.04em;white-space:nowrap}
.sev-critical{background:var(--crit);color:#fff} .sev-high{background:var(--high);color:#fff}
.sev-elevated{background:var(--elev);color:#fff} .sev-monitored{background:var(--mon);color:#fff}
.conf{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line)}
.tier{background:transparent;color:var(--brand-2);border:1px solid var(--brand-2)}
.aiunv{background:transparent;border:1px dashed var(--accent);color:var(--accent)}

/* dashboard */
.dash{display:grid;grid-template-columns:210px 1fr 230px;gap:16px}
@media(max-width:1023.98px){.dash{grid-template-columns:1fr}}
.rail{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.rail h4{font-size:11px;letter-spacing:.14em;color:var(--ink-soft);text-transform:uppercase;margin-bottom:10px;font-family:var(--font-sans)}
.dnav a{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:var(--radius);
  font-size:13px;cursor:pointer;color:var(--ink-soft);font-weight:600}
.dnav a:hover,.dnav a.active{background:var(--surface-2);color:var(--brand)}
.dnav .dot{width:9px;height:9px;border-radius:50%}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.panel .phead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:8px}
.panel .phead h3{font-size:18px}
table.risk{width:100%;border-collapse:collapse;font-size:13px}
table.risk th{text-align:left;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);
  padding:8px;border-bottom:2px solid var(--line);font-family:var(--font-sans)}
table.risk td{padding:11px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
table.risk tr:hover td{background:var(--surface-2)}
table.risk .ent{font-weight:700;color:var(--ink)}
.chg.up{color:var(--crit);font-weight:700}.chg.dn{color:var(--mon);font-weight:700}
.heat{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.heat .cell{aspect-ratio:1.4;border-radius:6px;display:flex;flex-direction:column;justify-content:flex-end;padding:7px;
  color:#fff;font-size:10.5px;font-weight:700;font-family:var(--font-mono);cursor:pointer;transition:.15s}
.heat .cell:hover{transform:scale(1.04)} .heat .cell small{font-size:8.5px;opacity:.8;font-weight:400}
.alertitem{padding:10px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.alertitem:last-child{border:0} .alertitem .t{font-weight:700;display:block;color:var(--ink)}

/* pricing */
.price{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:900px){.price{grid-template-columns:1fr 1fr}}@media(max-width:560px){.price{grid-template-columns:1fr}}
.ptier{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;position:relative}
.ptier.feat{border-color:var(--brand);box-shadow:0 8px 30px rgba(0,0,0,.10)}
.ptier .tag{position:absolute;top:-11px;left:22px;background:var(--brand);color:#fff;font-size:10px;padding:3px 10px;
  border-radius:20px;font-weight:700;letter-spacing:.06em}
[data-theme="terminal"] .ptier .tag{color:#04110d}
.ptier h3{font-size:18px} .ptier .amt{font-size:30px;font-weight:800;font-family:var(--head-font);margin:8px 0 2px}
.ptier .amt small{font-size:13px;color:var(--ink-soft);font-weight:400}
.ptier .found{font-size:12px;color:var(--accent);font-weight:700;margin-bottom:12px}
.ptier ul{list-style:none;font-size:13px;color:var(--ink-soft)}
.ptier li{padding:6px 0 6px 20px;position:relative} .ptier li:before{content:"\203A";position:absolute;left:4px;color:var(--brand-2);font-weight:700}

/* prose */
.prose{max-width:820px} .prose p{margin:12px 0;color:var(--ink-soft)}
.prose ul.moddef{margin:10px 0 4px;padding-left:20px}
.prose ul.moddef li{margin:9px 0;color:var(--ink-soft);font-size:14px;line-height:1.5}
.prose ul.moddef li b{color:var(--ink)}
.callout{background:var(--surface-2);border-left:3px solid var(--accent);padding:14px 16px;border-radius:6px;font-size:13.5px;margin:18px 0}
.matrix{width:100%;border-collapse:collapse;font-size:13px;margin-top:10px}
.matrix th,.matrix td{border:1px solid var(--line);padding:10px;text-align:left}
.matrix th{background:var(--surface-2);font-family:var(--font-sans);font-size:12px}
input,select{padding:11px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--ink);font:inherit}

/* disclaimer/footer */
.disc{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;
  font-size:12px;color:var(--ink-soft);margin-top:30px}
footer.site{background:var(--util-bg);color:var(--util-ink);margin-top:50px;padding:34px 0;font-size:13px;border-top:1px solid var(--util-line)}
footer.site .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px}
@media(max-width:767.98px){footer.site .cols{grid-template-columns:1fr 1fr}}
footer.site a{color:var(--util-ink);opacity:.85;display:block;padding:3px 0}
footer.site h5{font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;opacity:.7}
.foot-cycle{margin-top:20px;font-size:12px;opacity:.75;font-family:var(--mono)}
.foot-cycle:empty{display:none}
.foot-cycle .fc-label{text-transform:uppercase;letter-spacing:.06em;font-size:10.5px;font-weight:700;opacity:.75;margin-right:6px}
.foot-note{opacity:.6;font-size:11px;margin-top:22px;border-top:1px solid var(--util-line);padding-top:14px}

/* ── Per-JID News Rail (BRIEF-2026-06-20-WPM-PER-JID-NEWS-FEED §5) ──────────
   Right-rail dated updates for jurisdiction pages.
   Mirror of AIC .sector-dossier pattern; adapted for WPM per-jurisdiction.
   ALL layout in CSS — NO inline styles on news rail elements (inline-layout
   guard discipline, §5). Additive to existing base.css — no existing rules
   modified.
───────────────────────────────────────────────────────────────────────────── */

/* Jurisdiction page 3-column layout wrapper */
.jid-layout {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 24px;
  align-items: start;
}
@media (max-width: 900px) {
  .jid-layout {
    grid-template-columns: 1fr;
  }
}

/* Right rail container */
.jid-news-rail {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px;
  position: sticky;
  top: 80px;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
}

.jid-news-rail__title {
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--ink-soft);
  text-transform: uppercase;
  margin-bottom: 14px;
  font-family: var(--font-sans);
  font-weight: 700;
}

/* Individual feed item */
.jid-news__item {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.jid-news__item:last-child {
  border-bottom: 0;
}
.jid-news__item--archived {
  opacity: .8;
}

/* Item metadata row: date + badges */
.jid-news__item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 5px;
  align-items: center;
}

.jid-news__date {
  font-size: 10.5px;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  white-space: nowrap;
}

/* Module tag badge (W1a..W13) */
.jid-news__module-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 20px;
  font-family: var(--font-mono);
  letter-spacing: .04em;
  background: var(--surface-2);
  color: var(--brand-2);
  border: 1px solid var(--brand-2);
  white-space: nowrap;
}

/* Kind badge */
.jid-news__kind-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 20px;
  font-family: var(--font-mono);
  letter-spacing: .04em;
  background: transparent;
  color: var(--ink-soft);
  border: 1px solid var(--line);
  white-space: nowrap;
}
.jid-news__kind-tag--standing {
  color: var(--accent);
  border-color: var(--accent);
}

/* JID tag (aggregate page only) */
.jid-news__jid-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 20px;
  font-family: var(--font-mono);
  letter-spacing: .04em;
  background: var(--brand);
  color: #fff;
  white-space: nowrap;
}
[data-theme="terminal"] .jid-news__jid-tag {
  color: #04110d;
}

/* Headline */
.jid-news__headline {
  font-size: 12.5px;
  color: var(--ink);
  line-height: 1.4;
  margin: 0;
}
.jid-news__headline a {
  color: var(--brand-2);
  text-decoration: none;
}
.jid-news__headline a:hover {
  text-decoration: underline;
}

/* Detail line (instrument name) */
.jid-news__detail {
  font-size: 11px;
  color: var(--ink-soft);
  margin: 3px 0 0;
  font-style: italic;
}

/* Non-URL source attribution (shown as plain text when source isn't a link) */
.jid-news__source {
  font-size: 11px;
  color: var(--ink-soft);
  margin: 2px 0 0;
}

/* Empty state */
.jid-news__empty {
  font-size: 12.5px;
  color: var(--ink-soft);
  font-style: italic;
  padding: 8px 0;
}

/* Archive section heading */
.jid-news__archive-section {
  margin-top: 10px;
  border-top: 2px dashed var(--line);
  padding-top: 10px;
}
.jid-news__archive-heading {
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-soft);
  font-family: var(--font-sans);
  margin-bottom: 8px;
}

/* Archive link */
.jid-news__archive-link {
  display: block;
  margin-top: 12px;
  font-size: 11.5px;
  color: var(--brand-2);
  text-decoration: none;
  font-weight: 600;
}
.jid-news__archive-link:hover {
  text-decoration: underline;
}

/* Jurisdiction page header meta strip */
.jid-page-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 20px;
  align-items: center;
}
.jid-page-meta .badge {
  font-size: 11px;
}

/* News aggregate page — full-width feed list (news.html) */
.jid-news-aggregate {
  max-width: 820px;
}
.jid-news-aggregate .jid-news__item {
  padding: 14px 0;
}
.jid-news-aggregate .jid-news__headline {
  font-size: 14px;
}

/* ── WPM JID right-column redesign — data-honest colour devices ───────────────
   BRIEF-2026-06-28-WPM-JID-RIGHTCOL-REDESIGN (R5).
   ALL colour from real fields only: confidence tier (--conf, set inline) +
   fixed W-code category token (--cat-accent, set inline). NO RAG/trajectory
   scalar. Additive — these selectors are either new classes (.mod-id,
   .conf-chip) or attribute-qualified (higher specificity than the skin's bare
   .sec-tier/.card), so they layer cleanly over the skin template without
   modifying any existing rule.
───────────────────────────────────────────────────────────────────────────── */

/* Module section: category accent as a left-border cue (keeps skin border-top) */
.sec-tier[data-cat] {
  border-left: 3px solid var(--cat-accent, var(--line));
  padding-left: 16px;
}

/* Mono module-id chip (W-code), tinted to the category token */
.mod-id {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: var(--cat-accent, var(--ink-soft));
  border: 1px solid var(--cat-accent, var(--line));
  border-radius: 20px;
  padding: 2px 9px;
  white-space: nowrap;
}

/* Confidence chip — colour from the literal confidence tier (--conf inline) */
.conf-chip {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .04em;
  padding: 2px 9px;
  border-radius: 20px;
  color: var(--conf, var(--ink-soft));
  border: 1px solid var(--conf, var(--line));
  background: transparent;
  white-space: nowrap;
}

/* Claim card: category accent on the left border (replaces RAG r/a/g border) */
.card[data-cat] {
  border-left: 3px solid var(--cat-accent, var(--line));
}

/* ===========================================================================
   BRIEF-2026-06-28-WPM-JID-RIGHTCOL-PARTB (G1/G2 + KPI tiles, surface tiers).
   Forward-deadline calendar: deadline strip, W7 timeline, KPI tile row.
   COLOUR-HONEST: every accent here derives ONLY from --cat-accent (category
   W-code, set inline by the renderer) or --conf (confidence tier). Stage is a
   text sub-label, never a colour key. NO traffic-light / risk-grade scalar.
   Additive: all selectors are new classes that layer over the skin template.
   =========================================================================== */

/* Forward-deadline KPI tile — reuses the .kpi look; the forward-deadline tile
   needs no special colour (an honest count, not a grade). Surface-tier helper
   for dense prose breaks. */
.kpi.kpi-deadline { /* same chrome as .kpi; hook for future emphasis only */ }
.surface-2 { background: var(--surface-2, var(--surface)); }
.surface-3 { background: var(--surface-3, var(--surface-2, var(--surface))); }

/* G1 — forward-deadline strip: responsive card grid. Each .dlcard also carries
   .card so it inherits the card chrome + the .card[data-cat] left accent. */
.dl-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin: 14px 0 2px;
}
.dlcard {
  padding: 13px 15px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dl-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}
/* Stage = TEXT sub-label / kicker ONLY. Deliberately neutral ink — NEVER a
   colour key. The card's only colour cue is --cat-accent (category). */
.dl-stage {
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-soft, var(--ink-2));
}
.dl-date {
  font-family: var(--font-mono);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--cat-accent, var(--ink));
}
.dl-title {
  font-size: 13.5px;
  line-height: 1.4;
  color: var(--ink, #111);
}

/* G2 — W7 timeline: rows with a mono accent date and a single category-accent
   left border. NO .evt.esc traffic-light variants exist (forbidden). */
.timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 14px 0 2px;
  border-left: 2px solid var(--line);
  padding-left: 0;
}
.timeline .evt {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 14px;
  padding: 12px 0 12px 16px;
  border-left: 3px solid var(--cat-accent, var(--line));
  margin-left: -2px;
}
.timeline .evt + .evt { border-top: 1px solid var(--line); }
.timeline .evt .dt {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--cat-accent, var(--ink));
}
.tl-title {
  font-size: 13.5px;
  line-height: 1.4;
  color: var(--ink, #111);
}
.tl-stage {
  display: inline-block;
  margin-top: 3px;
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-soft, var(--ink-2));
}

/* R4 hero single-view: when the hero rendered flat (data-single-view="1"),
   there is no .tabs strip — nothing to style; the lone pane sits flush. */
.hero[data-single-view="1"] .tabpane { display: block; }

/* ════════════════════════════════════════════════════════════════════════
   DASHBOARD VIEW-LENSES (2026-06-29) — three operator-choosable views over the
   SAME report blob. Switcher = lens.js (mirrors theme.js): data-lens attr on
   <html> + storage('wpm-lens'); default 'triage' (operator-chosen).
   Visibility is pure CSS: only the active lens's .lensview-<id> shows.
   ════════════════════════════════════════════════════════════════════════ */

/* ── Lens switcher control (mirrors .themebar exactly) ───────────────────── */
.lensbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lensbar .lbl{font-size:11px;letter-spacing:.12em;opacity:.7;text-transform:uppercase}
.lensbar .opts{display:flex;gap:0;border:1px solid var(--util-line,var(--line));border-radius:30px;overflow:hidden}
.lensbar button{font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;border:0;background:transparent;
  color:var(--ink-soft);padding:7px 14px;transition:.15s}
.lensbar button:hover{color:var(--ink)}
.lensbar button.on{background:var(--brand);color:#fff}
[data-theme="terminal"] .lensbar button.on{color:#04110d}

/* ── Lens visibility — only the active lens shows ─────────────────────────── */
.lensview{display:none}
html[data-lens="triage"] .lensview-triage{display:block}
html[data-lens="map"]    .lensview-map{display:block}
html[data-lens="matrix"] .lensview-matrix{display:block}
/* Fail-safe: if no data-lens set at all, show triage */
html:not([data-lens]) .lensview-triage{display:block}

/* ════════ LENS A · TRIAGE (default) — "what moved this cycle" ════════════ */
.cyclestrip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
@media(max-width:680px){.cyclestrip{grid-template-columns:repeat(2,1fr)}}
.cyclestat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.cyclestat .num{font-size:30px;font-weight:800;line-height:1;font-family:var(--font-mono,var(--font-sans));letter-spacing:-.01em}
.cyclestat .lab{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px}
.cyclestat.crit .num{color:var(--crit)}
.cyclestat.up .num{color:var(--high)}
.cyclestat.dn .num{color:var(--mon)}

.feedfilter{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.feedfilter .ff-lbl{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-right:2px}
.feedfilter button{font:inherit;font-size:11.5px;font-weight:600;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);
  padding:5px 11px;border-radius:30px;transition:.15s}
.feedfilter button:hover{color:var(--ink);border-color:var(--brand)}
.feedfilter button.on{background:var(--brand);color:#fff;border-color:var(--brand)}
[data-theme="terminal"] .feedfilter button.on{color:#04110d}

table.feed{width:100%;border-collapse:collapse;font-size:13px}
table.feed th{text-align:left;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);
  padding:8px;border-bottom:2px solid var(--line);font-family:var(--font-sans);cursor:pointer;user-select:none;white-space:nowrap}
table.feed th:hover{color:var(--brand)}
table.feed th .arr{opacity:.5;font-size:9px;margin-left:3px}
table.feed td{padding:11px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
table.feed tr:hover td{background:var(--surface-2)}
table.feed .ent{font-weight:700;color:var(--ink)}
.domchip{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.05em;
  padding:2px 7px;border-radius:20px;background:var(--surface-2);color:var(--ink-soft);
  border:1px solid var(--line);white-space:nowrap}
.feed .chg-up{color:var(--crit);font-weight:700}
.feed .chg-dn{color:var(--mon);font-weight:700}
.feed .chg-stable{color:var(--ink-soft)}
.feedempty{padding:24px 8px;text-align:center;color:var(--ink-soft);font-size:13px}

/* ════════ LENS B · MAP — full-width interactive risk map ═════════════════ */
.bigmap{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:8px;margin-bottom:16px}
.bigmap .cell{aspect-ratio:1.5;border-radius:8px;display:flex;flex-direction:column;justify-content:flex-end;
  padding:10px;cursor:pointer;color:#fff;font-weight:800;font-size:15px;transition:.15s;border:2px solid transparent}
.bigmap .cell small{display:block;font-size:9.5px;opacity:.85;font-weight:600;letter-spacing:.04em;margin-top:2px}
.bigmap .cell:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.bigmap .cell.sel{border-color:var(--ink);box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--ink)}
.maplegend{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px;font-size:11px;align-items:center}
.maplegend .li{display:flex;align-items:center;gap:6px;color:var(--ink-soft)}
.maplegend .sw{width:13px;height:13px;border-radius:3px;display:inline-block}
.jidprofile{border-top:1px solid var(--line);padding-top:16px;margin-top:4px}
.jidprofile .jp-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.jidprofile .jp-head h4{font-size:18px;margin:0}
.jidprofile .jp-hint{font-size:12px;color:var(--ink-soft)}
.jidgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.jidgrid .jg-card{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);padding:11px 13px}
.jidgrid .jg-card .jg-dom{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:5px}
.jidgrid .jg-card .jg-ent{font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.4}
.jp-link{font-size:12px;font-weight:700;color:var(--brand);text-decoration:none}
.jp-link:hover{text-decoration:underline}

/* ════════ LENS C · MATRIX — domain × jurisdiction heat-grid ══════════════ */
.matrixwrap{overflow-x:auto}
table.matrix{border-collapse:collapse;font-size:12px;min-width:100%}
table.matrix th,table.matrix td{border:1px solid var(--line);padding:7px 9px;text-align:center}
table.matrix thead th{font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);
  background:var(--surface-2);position:sticky;top:0;white-space:nowrap}
table.matrix tbody th{text-align:left;font-weight:700;color:var(--ink);white-space:nowrap;background:var(--surface)}
table.matrix td.mc{cursor:pointer;font-weight:800;color:#fff;transition:.12s}
table.matrix td.mc:hover{outline:2px solid var(--ink);outline-offset:-2px}
table.matrix td.empty{color:var(--ink-soft);opacity:.35}
.matrixdetail{border-top:1px solid var(--line);padding-top:14px;margin-top:14px;font-size:13px}
.matrixdetail h4{font-size:16px;margin-bottom:10px}
.matrixdetail .md-row{padding:9px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.matrixdetail .md-row .ent{font-weight:700;color:var(--ink)}
.matrixdetail .md-empty{color:var(--ink-soft)}

/* ── Shared responsive ───────────────────────────────────────────────────── */
@media(max-width:860px){
  .cyclestrip{grid-template-columns:repeat(2,1fr)}
  .bigmap{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
}

/* ---- Mobile nav drawer (engine-ui-spec.md §3.6 VP-006) ---- */
.nav-toggle{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.nav-toggle:focus-visible + .nav-toggle-label{outline:2px solid var(--brand);outline-offset:3px}
.nav-toggle-label{display:none;cursor:pointer;width:44px;height:44px;
  flex-direction:column;justify-content:center;align-items:center;gap:5px;
  margin-left:auto;padding:10px;border-radius:var(--radius)}
.nav-toggle-label span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;
  transition:transform .15s,opacity .15s}

@media(max-width:767.98px){
  header.site .wrap{flex-wrap:nowrap;gap:12px}
  .nav-toggle-label{display:flex}
  .btn-primary{display:none}
  nav.main{display:none;position:fixed;top:64px;left:0;right:0;
    background:var(--surface);border-bottom:1px solid var(--line);
    flex-direction:column;gap:0;padding:8px 0;
    max-height:calc(100dvh - 64px);overflow-y:auto;
    box-shadow:0 8px 24px rgba(0,0,0,.08);z-index:49}
  .nav-toggle:checked ~ nav.main{display:flex}
  nav.main a{padding:14px 22px;font-size:16px;border-radius:0;
    border-bottom:1px solid var(--line)}
  nav.main a:last-child{border-bottom:0}
  a.btn-primary-mobile{display:block;margin:8px 22px 4px;
    padding:12px 16px;background:var(--brand);color:#fff;
    border-radius:var(--radius);font-weight:700;font-size:15px;text-align:center;
    text-decoration:none}
  .nav-toggle:checked + .nav-toggle-label span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked + .nav-toggle-label span:nth-child(2){opacity:0}
  .nav-toggle:checked + .nav-toggle-label span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}
@media(prefers-reduced-motion:reduce){
  .nav-toggle-label span{transition:none}
}


/* ── Hero stat strip + eyebrow (UX-2026-07-07) ──────────────────────────────
   Replaces the static .trust bullet line. Numbers populate from report-latest.json.
   Eyebrow: small-caps mono label above H1. Token vars only (T.10/T.12). */
.hero-eyebrow{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:14px}
.hero-stat-strip{
  display:flex;margin-top:28px;
  border-top:1px solid rgba(255,255,255,.14);
  padding-top:0;flex-wrap:wrap}
.hss-stat{
  flex:1;min-width:120px;
  padding:16px 20px 14px;
  border-right:1px solid rgba(255,255,255,.1)}
.hss-stat:last-child{border-right:none}
.hss-num{
  font-family:var(--font-mono);font-size:20px;font-weight:700;
  color:#fff;line-height:1;margin-bottom:4px}
.hss-num.hss-alert{color:#f87171}
.hss-lbl{font-size:11px;color:rgba(255,255,255,.55);
  letter-spacing:.06em;text-transform:uppercase;font-family:var(--font-mono)}
.hss-sub{font-size:11px;color:rgba(255,255,255,.4);margin-top:3px;
  font-family:var(--font-mono)}
@media(max-width:767.98px){
  .hero-stat-strip{margin-top:20px}
  .hss-stat{flex:0 0 50%;border-right:none;
    border-bottom:1px solid rgba(255,255,255,.08);padding:12px 16px}
  .hss-stat:last-child{border-bottom:none}
}

/* ── Section divider (UX-2026-07-07) ────────────────────────────────────────
   Lightweight horizontal rule between major home-page content blocks. */
hr.sec-div{border:none;border-top:1px solid var(--line);margin:36px 0 28px;opacity:.6}

/* ── Hero H1 controlled break (UX-2026-07-07) ───────────────────────────────
   Forces break before "regulatory monitor" on medium viewports to avoid
   a widow line break mid-phrase. Hidden on wide + narrow viewports. */
.hero-br{display:none}
@media(max-width:900px) and (min-width:600px){.hero-br{display:block}}

/* ── Exemptions page CSS (extracted from inline style, UX-2026-07-07) ───────
   Moved from exemptions.html inline <style> block; inline-layout guard rule. */
.exemp-matrix{overflow-x:auto;margin:14px 0}
.exemp-matrix table{width:100%;border-collapse:collapse;font-size:12px}
.exemp-matrix th,.exemp-matrix td{padding:7px 10px;border:1px solid var(--border);text-align:center}
.exemp-matrix th{background:var(--surface-2);font-weight:600;font-size:11px}
.exemp-matrix td.jid{text-align:left;font-weight:600;font-family:var(--font-mono)}
.cell-yes{background:var(--mon-bg);color:var(--mon)}
.cell-yes a{color:inherit;text-decoration:none;font-weight:600;border-bottom:1px dotted currentColor}
.cell-no{color:var(--ink-soft)}
.cell-tent{background:var(--elev-bg);color:var(--high);font-style:italic}
/* BRIEF-2026-07-05-WPM-CROSS-JID-FUNNEL-CONTRACT §4.1 Phase 2 E3: inheritance-tinted
   cell variants (additive; base .cell-yes above stays the fallback). */
.cell-yes.cell-observed{background:var(--mon-bg);color:var(--mon)}
.cell-yes.cell-regime_inherited{background:var(--elev-bg);color:var(--high)}
.cell-yes.cell-both{background:var(--mon-bg);color:var(--mon);font-weight:700}
.exemp-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:11px;color:var(--ink-soft);margin:8px 0 0}
.exemp-legend .swatch{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:middle}
.exemp-legend .swatch.observed{background:var(--mon-bg);border:1px solid var(--mon)}
.exemp-legend .swatch.regime_inherited{background:var(--elev-bg);border:1px solid var(--high)}
.exemp-legend .swatch.both{background:var(--mon-bg);border:1px solid var(--mon)}
.excard{background:var(--surface-2);border-radius:8px;padding:16px;margin-bottom:12px}
.excard h4{margin:0 0 6px;font-size:14px}
.excard p{font-size:13px;color:var(--ink-soft);margin:0}
.thresh-table{width:100%;border-collapse:collapse;font-size:12px;margin:10px 0}
.thresh-table th,.thresh-table td{padding:7px 10px;border:1px solid var(--border);text-align:left}
.thresh-table th{background:var(--surface-2);font-weight:600}
.reg-table{width:100%;border-collapse:collapse;font-size:12px;margin:10px 0}
.reg-table th,.reg-table td{padding:7px 10px;border:1px solid var(--border);text-align:left}
.reg-table th{background:var(--surface-2);font-weight:600}
/* ── Theme icon button (UX-2026-07-07) ──────────────────────────────────────
   Compact sun/moon toggle in the site header. Token vars only (T.10/T.12). */
.theme-icon-btn{display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border:1px solid var(--line);border-radius:var(--radius);
  background:transparent;color:var(--ink-soft);cursor:pointer;transition:.15s;
  flex-shrink:0}
.theme-icon-btn:hover{background:var(--surface-2);color:var(--ink)}
.theme-icon-btn .ti-icon{pointer-events:none}
.theme-icon-btn[data-current="institutional"] .ti-moon{display:none}
.theme-icon-btn[data-current="terminal"] .ti-sun{display:none}
@media(max-width:767.98px){.theme-icon-btn{margin-left:auto;margin-right:8px}}

/* ── Hero text CTA link (UX-2026-07-07) ────────────────────────────────────
   "Request demo" demoted from btn-ghost to a subtle inline text link. */
.cta-link{color:var(--ink-soft);text-decoration:underline;font-size:.9rem;
  transition:color .15s}
.cta-link:hover{color:var(--ink)}

/* ── FIM per-JID risk section (WPM C1.3) — additive, presence-gated ─────────
   All values are theme tokens (no hard-coded hex, RUNBOOK §A). Rendered only
   when /data/fim/<iso>.json is present; absent → this block styles nothing. */
.fim-risk{margin-top:22px}
.fim-risk .sbadge{font:700 9.5px/1 var(--font-mono);letter-spacing:.06em;
  background:var(--surface-2);border:1px solid var(--line);border-radius:999px;
  padding:3px 8px;color:var(--ink-2);margin-left:8px;vertical-align:middle}
.fim-headline{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:8px 0}
.fim-headline .fim-score,.fim-headline .fim-dir{font:600 12px/1 var(--font-mono);
  color:var(--ink-2)}
.fim-headline .fim-score b{color:var(--ink)}
.fim-risk .fim-edd{font-size:13px;color:var(--ink-2);margin:4px 0 10px}
.fim-risk .fim-sub{font:700 12px/1 var(--font-mono);letter-spacing:.04em;
  color:var(--ink-2);text-transform:uppercase;margin:14px 0 6px}
.fim-tbl{width:100%;border-collapse:collapse;font-size:13px}
.fim-tbl th,.fim-tbl td{text-align:left;padding:6px 10px;border-bottom:1px solid var(--line)}
.fim-tbl th{font:700 11px/1 var(--font-mono);color:var(--ink-2);text-transform:uppercase}
.fim-chips{display:flex;gap:6px;flex-wrap:wrap}
.fim-enf{list-style:none;padding:0;margin:0;font-size:13px}
.fim-enf li{padding:5px 0;border-bottom:1px solid var(--line);color:var(--ink-2)}
.fim-envelope{margin-top:14px;padding-top:10px;border-top:1px solid var(--line);
  display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.fim-envelope .fim-asof{font:600 11px/1 var(--font-mono);color:var(--ink-2)}
.fim-gap{flex-basis:100%;font-size:12px;color:var(--ink-2);margin:8px 0 0}
.fim-boundary{flex-basis:100%;font-size:11.5px;color:var(--ink-soft);
  font-style:italic;margin:8px 0 0}

/* ===== BEGIN VENDORED fe-commons/fe-print.css — DO NOT EDIT HERE ===== */
/* ==========================================================================
   fe-print.css — the print register, fleet-wide
   SSOT: asym-intel-commons:fe-commons/fe-print.css
   Vendored verbatim into each consumer between the BEGIN/END markers below.
   Edit here, never in a vendored copy.

   WHY THIS FILE EXISTS
   A print stylesheet is the classic entitlement bypass. With no @media print
   rule, printing or "Save as PDF" renders whatever the screen renders — and a
   gated block that is merely visually masked on screen prints in full. The
   entitlement gate is being built on the assumption that gated payload is not
   served to an unentitled reader, but any block that IS served and only styled
   away must also be styled away for print, or the gate leaks through the
   printer. Preflight assertion 7 fails a consumer whose print register does
   not name the gated selectors.

   The gated markers are the fleet convention: .paywall (live on advennt
   jurisdiction pages), [data-access="gated"], and [data-entitlement] other
   than an explicitly free value.
   ========================================================================== */

@media print {
  /* 1. Gated payload never prints. !important is deliberate: this must beat any
        later screen rule, including inline styles set by hydration JS. */
  /* Inert markers are EXEMPT. The WPM per-JID renderer stamps
     `paywall paywall-inert` + `data-access="gated" data-paywall="inert"` on
     every module section as an access CLASSIFICATION ("attribute-only; no
     styling, no suppression" - _sec_wrap). Without this exemption the print
     register read the classification as a live gate and every WPM PDF came
     out with all 14 module sections missing, while the page still offered a
     Print/PDF button. A real gate must not carry the inert markers. */
  .paywall:not(.paywall-inert),
  [data-access="gated"]:not([data-paywall="inert"]),
  [data-access="locked"],
  [data-entitlement]:not([data-entitlement="free"]):not([data-entitlement="public"]) {
    display: none !important;
  }

  /* 2. Chrome that means nothing on paper. Navigation, lens switches, consent
        prompts and drawers are interactive affordances; printing them wastes
        the page and implies the reader can click them. */
  .jidlensbar,
  .viewbar,
  #viewbar,
  .lensseg,
  #lensseg,
  [data-consent-mount],
  #consent-mount,
  .drawer,
  .drawer-scrim,
  nav.site-nav,
  .site-header__util,
  .persona-row,
  .skip-link {
    display: none !important;
  }

  /* 3. Print in the light register regardless of the on-screen theme. Dark
        backgrounds print as either a solid block of ink or nothing at all,
        depending on the driver, and neither is legible. */
  :where(html, body) {
    background: #fff !important;
    color: #000 !important;
  }

  /* 4. Collapsed content prints expanded. A reader printing a page expects the
        text, not the affordance — but only content they are entitled to, which
        rule 1 has already removed. */
  details:not([open]) > *:not(summary) {
    display: revert !important;
  }
  [hidden].lens-view.on,
  .lens-view.on {
    display: block !important;
  }

  /* 5. Citations survive the loss of hover. A printed page whose sources are
        invisible cannot be checked, which for regulatory analysis is the whole
        value of the document. */
  a[href^="http"]::after {
    content: " <" attr(href) ">";
    font-size: 0.85em;
    word-break: break-all;
  }

  /* 6. Do not orphan a heading from the analysis it introduces. */
  h1, h2, h3, h4, caption, th {
    break-after: avoid-page;
    page-break-after: avoid;
  }
  table, figure, blockquote, .card, .lens-card, .role-card {
    break-inside: avoid-page;
    page-break-inside: avoid;
  }
}
/* ===== END VENDORED fe-commons/fe-print.css ===== */

/* ============================================================
   Accessibility + small-fixes appendix — BRIEF-2026-07-31 §4.4 + §4.7 cure
   Landed 2026-07-31 (world-payments PR — SSR sibling).
   Only additive: no existing selector is altered, no cascade order changes.
   ------------------------------------------------------------
   §4.4  Focus visibility (WCAG 2.4.7) — no :focus/:focus-visible
         existed in base.css beyond one nav-toggle rule. Keyboard users
         cannot see focus position on ANY other interactive element.
   §4.7  In-page anchors land under the 64px sticky header (no
         scroll-margin-top); KPI digits do not align (no tabular-nums);
         drawer scroll chains to body; long prose has no measure cap.
   ============================================================ */

/* --- §4.4 Focus visibility --------------------------------- */

/* Universal, high-contrast, distinct from hover. --brand is used
   because it is the one token guaranteed to contrast with every
   surface in every theme. Fallback via double-outline so the ring
   is visible against very dark AND very light backgrounds. */
:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  border-radius: 3px;
}

/* Explicitly restore focus rings on interactive elements whose UA
   default has been suppressed elsewhere (button resets, [role=button]
   patterns, custom disclosures). */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}

/* --- §4.7 Smaller fixes ------------------------------------ */

/* header.site is position:sticky with height:64px (line 40). In-page
   anchors currently land under the header. 16px cushion below. */
[id] {
  scroll-margin-top: calc(64px + 16px);
}

/* Tabular numerals so KPI values and cycle-count digits align. Only
   targets elements that visibly display numeric values. */
.kpi-value,
.kpi-num,
.hs-num,
.hss-num,
.ct,
.badge.tier {
  font-variant-numeric: tabular-nums;
}

/* Prevent drawer scroll from chaining to <body> when the drawer hits
   the top/bottom of its scroll range. Firefox + Chromium; ignored on
   Safari < 16 (harmless). */
#drawer,
.jid-drawer,
.evidence-drawer {
  overscroll-behavior: contain;
}

/* Measure cap on long prose blocks so lines do not sprawl on wide
   viewports. Only affects paragraphs *inside* prose blocks so KPI/chart
   text is unaffected. */
.blk p,
.brief-body p,
.methodology p,
article.prose p {
  max-width: 74ch;
}

/* --- end appendix ------------------------------------------ */

/* ── Accessibility: skip-to-content link ────────────────────────────────
   BRIEF-2026-07-31 §4.5. The .skip anchor is emitted by
   partials.js `ensureSkipLink()` and is the very first focusable node in
   the document. Off-screen by default; slides into view when it receives
   keyboard focus so a keyboard-only visitor can bypass the header + nav
   drawer instead of tab-cycling through them on every page load.
   Rationale — a11y.md WCAG 2.4.1 (Bypass Blocks).
------------------------------------------------------------------ */
.skip {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10000;
  padding: 8px 14px;
  background: var(--accent, #1e40af);
  color: #fff;
  font-weight: 600;
  font-size: 0.85rem;
  text-decoration: none;
  border-radius: 0 0 6px 0;
  transform: translateY(-120%);
  transition: transform 0.15s ease-out;
}
.skip:focus,
.skip:focus-visible {
  transform: translateY(0);
  outline: 2px solid var(--accent, #1e40af);
  outline-offset: 2px;
}