:root{
  --emerald-950:#002B1B;
  --emerald-900:#003D26;
  --emerald-850:#00593A;
  --emerald-800:#006B44;
  --emerald-700:#008F5A;
  --gold-500:#B8934A;
  --gold-400:#D4A843;
  --gold-300:#C9A96E;
  --gold-200:#D4B87A;
  --ivory:#f4f1e6;
  --ivory-dim:#d9d4c2;
  --ink:#0a1a14;
  --hair:rgba(217,187,111,0.18);
  --hair-strong:rgba(217,187,111,0.38);
  --display:'Fraunces',serif;
  --body:'Source Serif 4',serif;
  --mono:'IBM Plex Mono',monospace;
  color-scheme:dark;

  /* ===== Section 5: Motion Design Tokens (Sovereign Presence) ===== */
  --ease-standard:ease-in-out;
  --ease-out:ease-out;
  --ease-modal:cubic-bezier(.22,1,.36,1);
  --dur-page:300ms;
  --dur-hover:200ms;
  --dur-modal:250ms;
  --dur-notify:400ms;
  --dur-spin:800ms;
  --focus-flash:rgba(217,187,111,0.35);
  --content-section:980px;
  --content-block:640px;
  --content-narrow:560px;
  --content-medium:1024px;
  --content-form:420px;
  --content-tablet:820px;
  --grid-cols:12;
  --grid-gutter:24px;
}

/* ===== WCAG 2.1 AA — Light Mode Palette =====
   Body text:      Institutional Gray #3D3D3D on Pearl White #F8F6F2 — 7.0:1
   Large text:     Diplomatic Gray  #1A1A1A on Pearl White #F8F6F2 — 15.0:1
   UI / Links:     Sovereign Emerald #006B44 on Pearl White #F8F6F2 — 4.5:1
   Champagne accents remain on Deep Sovereign #003D26 — 4.0:1 */
[data-theme="light"]{
  color-scheme:light;
  --emerald-950:#F8F6F2;
  --emerald-900:#FFFFFF;
  --emerald-850:#F1EEE7;
  --emerald-800:#EAE5D9;
  --emerald-700:#E0DACB;
  --gold-500:#00593a;
  --gold-400:#006B44;
  --gold-300:#00593a;
  --gold-200:#004a30;
  --ivory:#1A1A1A;
  --ivory-dim:#3D3D3D;
  --ink:#F8F6F2;
  --hair:rgba(0,107,68,0.16);
  --hair-strong:rgba(0,107,68,0.34);
  --focus-flash:rgba(0,107,68,0.28);
}
/* Chrome that must stay on Deep Sovereign so champagne gold keeps its 4:1 contrast */
[data-theme="light"] .masthead,
[data-theme="light"] .hero,
[data-theme="light"] .cta-banner,
[data-theme="light"] .twins,
[data-theme="light"] .newsletter,
[data-theme="light"] footer,
[data-theme="light"] .wire,
[data-theme="light"] .breaking-banner,
[data-theme="light"] .bottom-nav,
[data-theme="light"] .mobile-drawer{
  --emerald-950:#002B1B;
  --emerald-900:#003D26;
  --emerald-850:#00593A;
  --emerald-800:#006B44;
  --emerald-700:#008F5A;
  --gold-500:#B8934A;
  --gold-400:#D4A843;
  --gold-300:#C9A96E;
  --gold-200:#D4B87A;
  --ivory:#f4f1e6;
  --ivory-dim:#d9d4c2;
  --ink:#0a1a14;
  --hair:rgba(217,187,111,0.18);
  --hair-strong:rgba(217,187,111,0.38);
}
@media(prefers-contrast:more){
  :root{--hair-strong:rgba(217,187,111,0.6);}
  [data-theme="light"]{--hair-strong:rgba(0,107,68,0.55);}
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--emerald-950);
  color:var(--ivory);
  font-family:var(--body);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* 12-column grid primitives (§14/15) — same foundation as the
   institutional page. Re-audited against actual markup (milestone 159):
   of ~30 grid-template-columns rules on this page, 28 are not
   losslessly retrofittable — JS-populated with no fixed child count
   (#fcGrid), auto-fill responsive card grids (.ir-grid,
   .inst-capability-grid, .ci-primitives-grid, .io-items), hairline
   1px-divider grids where a col-span swap would kill the divider
   background trick (.bureaus, .twin-grid, .wse-strip, .price-grid,
   .discount-tables, .priority-tables), or genuinely asymmetric ratios
   (.hero, .live-grid, .alerts-panel, .feed, .footer-grid, .dev-grid).
   .nl-grid WAS retrofitted this pass — static 2-child 1fr/1fr split,
   now repeat(var(--grid-cols),1fr) with col-span-6 on each child,
   custom 60px gap preserved. Available for new layout work. */
.grid-12{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--grid-gutter);}
.col-span-2{grid-column:span 2;}
.col-span-3{grid-column:span 3;}
.col-span-4{grid-column:span 4;}
.col-span-6{grid-column:span 6;}
.col-span-8{grid-column:span 8;}
.col-span-12{grid-column:span 12;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

/* ===== texture ===== */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:999;opacity:0.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== wire ticker (signature element) ===== */
.wire{
  background:var(--emerald-900);
  border-bottom:1px solid var(--hair);
  overflow:hidden;
  white-space:nowrap;
  position:relative;
  height:40px;
  display:flex;
  align-items:center;
}
.wire::before{
  content:'DISPATCH';
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  color:var(--ink);
  background:var(--gold-400);
  padding:5px 14px;
  height:100%;
  display:flex;
  align-items:center;
  z-index:2;
  flex-shrink:0;
}
.wire-track{
  display:flex;
  gap:48px;
  animation:scroll-wire 42s linear infinite;
  padding-left:24px;
  align-items:center;
}
.wire:hover .wire-track{animation-play-state:paused;}
.wire-item{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.03em;
  color:var(--ivory-dim);
  display:flex;
  gap:10px;
  align-items:center;
}
.wire-item b{color:var(--ivory-dim);font-weight:500;}
@keyframes scroll-wire{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* ===== masthead ===== */
.masthead{
  position:relative;
  border-bottom:1px solid var(--hair-strong);
  padding:22px 5vw 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:
    radial-gradient(ellipse 900px 500px at 15% -20%, rgba(217,187,111,0.06), transparent 60%),
    var(--emerald-950);
}
.brand{display:flex;align-items:center;gap:16px;}
.seal{height:40px;width:auto;flex-shrink:0;}
.brand-text{display:flex;flex-direction:column;line-height:1.05;padding-left:16px;border-left:1px solid var(--hair-strong);}
.brand-text .name{
  font-family:var(--display);
  font-weight:600;
  font-size:19px;
  letter-spacing:0.01em;
  color:var(--ivory);
}
.brand-text .sub{
  font-family:var(--mono);
  font-size:9.5px;
  letter-spacing:0.22em;
  color:var(--ivory-dim);
  margin-top:4px;
  text-transform:uppercase;
}
.nav{display:flex;gap:38px;align-items:center;}
.nav a{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ivory-dim);
  padding-bottom:3px;
  border-bottom:1px solid transparent;
  transition:color .25s ease, border-color .25s ease;
}
.nav a:hover{color:var(--ivory-dim);border-color:var(--ivory);}
.nav .cta{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink);
  background:linear-gradient(180deg,var(--gold-300),var(--gold-500));
  padding:10px 20px;
  border-radius:1px;
  box-shadow:0 1px 0 rgba(0,0,0,0.2) inset, 0 6px 18px rgba(198,158,74,0.18);
}
.nav-toggle{display:none;}
.fc-link{display:flex;align-items:center;gap:7px;}
.fc-live{
  font-family:var(--mono);font-size:8.5px;letter-spacing:0.08em;text-transform:uppercase;
  color:#04241c;background:#8fd6a8;padding:2px 6px;border-radius:2px;font-weight:600;
  position:relative;
}
.fc-live::before{
  content:'';position:absolute;left:-9px;top:50%;transform:translateY(-50%);
  width:5px;height:5px;border-radius:50%;background:#8fd6a8;
  box-shadow:0 0 0 0 rgba(143,214,168,0.6);animation:pulse 2s infinite;
}

/* ===== language selector ===== */
.lang-wrap{position:relative;}
.lang-trigger{
  display:flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:11px;letter-spacing:0.08em;
  color:var(--ivory-dim);background:transparent;border:1px solid var(--hair-strong);
  padding:9px 14px;cursor:pointer;transition:border-color .2s ease, color .2s ease;
}
.lang-trigger:hover,.lang-trigger[aria-expanded="true"]{border-color:var(--ivory);color:var(--ivory-dim);}
.lang-trigger svg{flex-shrink:0;}
.lang-trigger .code{color:var(--ivory-dim);font-weight:500;}
.lang-trigger .caret{transition:transform .2s ease;opacity:0.7;}
.lang-trigger[aria-expanded="true"] .caret{transform:rotate(180deg);}

.lang-panel{
  position:absolute;top:calc(100% + 12px);right:0;
  width:400px;max-height:70vh;
  background:var(--emerald-900);
  border:1px solid var(--hair-strong);
  box-shadow:0 24px 60px rgba(0,0,0,0.45);
  z-index:200;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
  display:flex;flex-direction:column;
}
.lang-panel.open{opacity:1;visibility:visible;transform:translateY(0);}
.lang-panel::before{
  content:'';position:absolute;top:-1px;left:-1px;width:16px;height:16px;
  border-top:2px solid var(--gold-400);border-left:2px solid var(--gold-400);
}
.lang-search-box{padding:18px 18px 14px;border-bottom:1px solid var(--hair);flex-shrink:0;}
.lang-search-box input{
  width:100%;background:var(--emerald-950);border:1px solid var(--hair-strong);
  color:var(--ivory);font-family:var(--mono);font-size:12.5px;padding:11px 14px;
  letter-spacing:0.02em;
}
.lang-search-box input:focus{outline:none;border-color:var(--ivory);}
.lang-search-box input::placeholder{color:var(--ivory-dim);opacity:0.6;}
.lang-legend{
  display:flex;gap:16px;padding:12px 18px;border-bottom:1px solid var(--hair);
  font-family:var(--mono);font-size:9.5px;letter-spacing:0.04em;color:var(--ivory-dim);flex-shrink:0;
}
.lang-legend span{display:flex;align-items:center;gap:5px;}
.dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.dot.verified{background:#8fd6a8;}
.dot.progress{background:var(--gold-400);}
.dot.ai{background:#8fb8d6;}
.lang-list{overflow-y:auto;padding:8px 0;}
.lang-list::-webkit-scrollbar{width:6px;}
.lang-list::-webkit-scrollbar-thumb{background:var(--hair-strong);}
.lang-region{
  font-family:var(--mono);font-size:9.5px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ivory-dim);padding:14px 18px 8px;
}
.lang-option{
  display:flex;align-items:center;gap:12px;width:100%;text-align:left;
  padding:10px 18px;background:transparent;border:none;cursor:pointer;
  transition:background .15s ease;
}
.lang-option:hover,.lang-option.focused{background:rgba(217,187,111,0.07);}
.lang-option .flag{font-size:16px;flex-shrink:0;width:20px;text-align:center;}
.lang-option .names{flex:1;min-width:0;}
.lang-option .native{font-family:var(--body);font-size:14px;color:var(--ivory);display:block;}
.lang-option .code2{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);letter-spacing:0.06em;}
.lang-option .status-dot{flex-shrink:0;}
.lang-empty{padding:30px 18px;text-align:center;font-family:var(--mono);font-size:12px;color:var(--ivory-dim);}
.lang-hint{
  padding:12px 18px;border-top:1px solid var(--hair);flex-shrink:0;
  font-family:var(--mono);font-size:9.5px;color:var(--ivory-dim);letter-spacing:0.03em;
  display:flex;justify-content:space-between;
}
.lang-hint kbd{
  border:1px solid var(--hair-strong);padding:1px 5px;border-radius:2px;font-family:var(--mono);
}
@media(max-width:980px){
  .lang-panel{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;max-height:80vh;}
}

/* ===== hero ===== */
.hero{
  position:relative;
  padding:min(11vw,120px) 5vw 90px;
  display:grid;
  grid-template-columns:1.3fr 0.9fr;
  gap:64px;
  border-bottom:1px solid var(--hair);
  background:
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.15) 100%),
    var(--emerald-950);
}
.hero::after{
  content:'';
  position:absolute;
  top:0;right:0;bottom:0;
  width:38%;
  background:
    repeating-linear-gradient(90deg, transparent, transparent 39px, var(--hair) 40px),
    radial-gradient(ellipse 600px 700px at 100% 30%, rgba(217,187,111,0.05), transparent 70%);
  opacity:0.6;
  pointer-events:none;
}
.eyebrow{
  font-family:var(--mono);
  font-size:11.5px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--ivory-dim);
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:26px;
}
.eyebrow::before{content:'';width:26px;height:1px;background:var(--gold-400);}
.hero h1{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(40px,4.6vw,72px);
  line-height:1.04;
  letter-spacing:-0.01em;
  color:var(--ivory);
  max-width:15ch;
}
.hero h1 em{
  font-style:italic;
  font-weight:400;
  color:var(--ivory-dim);
}
/* Milestone 180 — hero wire motion (directive §3: purposeful, subtle, consistent) */
.hero-pulse{
  animation:hero-travel 6s linear infinite;
}
@keyframes hero-travel{
  0%{stroke-dashoffset:600;}
  100%{stroke-dashoffset:0;}
}
.hero-node-glow circle{
  opacity:0;
  animation:hero-node-pulse 4.5s ease-in-out infinite;
}
@keyframes hero-node-pulse{
  0%,100%{opacity:0;}
  50%{opacity:0.9;}
}
@media(prefers-reduced-motion:reduce){
  .hero-pulse{animation:none; opacity:0;}
  .hero-node-glow circle{animation:none; opacity:0.6;}
}
.hero p.lede{
  font-family:var(--body);
  font-size:18px;
  line-height:1.65;
  color:var(--ivory-dim);
  max-width:46ch;
  margin-top:28px;
  font-weight:400;
}
.hero-actions{display:flex;gap:18px;margin-top:40px;align-items:center;}
/* Milestone 169 (directive §11/§13): real ratio-locked hero visual for
   the right 40% column. object-fit-style sizing via viewBox keeps the
   SVG from ever stretching or distorting at any width. */
.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;z-index:1;}
.hero-visual svg{width:100%;max-width:420px;height:auto;}
@media(max-width:980px){
  .hero-visual{display:flex;}
}

/* ===== Milestone 183 — Sovereign Emerald & Champagne Gold hero upgrade =====
   Two real, separable additions, not a rebuild of the honest architecture
   above (grid ratio, motion-reduce handling, live-data pattern all kept):
   1) .hero-lattice — an ambient, aria-hidden decorative signal-lattice
      background (adapted from the approved hero-concept.html mockup).
      Purely atmospheric, makes no data claim, so it carries no honesty
      obligation the way a number or headline would.
   2) .hero-wire — REPLACES hero-concept.html's hardcoded fake "2 min ago"
      wire items with a real card wired to the same live, public
      GET /content/articles endpoint already used by the Dispatches grid
      (see loadHeroWire() near the other load* functions). Loading/Live/
      Empty/Error states follow the same honest contract as
      loadVerificationStats()/loadSources() elsewhere in this file. */
.hero{isolation:isolate;}
.hero>div{position:relative;z-index:1;}
.hero-lattice{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0.55;}
.hero-lattice svg{width:100%;height:100%;display:block;}
.hl-node{fill:var(--gold-400);opacity:0.85;}
.hl-node.dim{fill:var(--gold-500);opacity:0.32;}
.hl-line{stroke:var(--hair);stroke-width:1;fill:none;}
.hl-pulse{fill:none;stroke:var(--gold-300);stroke-width:1;stroke-dasharray:4 3000;opacity:0.6;animation:hl-travel 8s linear infinite;}
.hl-pulse.slow{animation-duration:12s;stroke:var(--gold-400);opacity:0.4;}
.hl-pulse.fast{animation-duration:5s;stroke:var(--ivory-dim);opacity:0.45;}
@keyframes hl-travel{0%{stroke-dashoffset:3000;}100%{stroke-dashoffset:0;}}
.hl-glow{fill:var(--gold-400);opacity:0;animation:hl-glow 6s ease-in-out infinite;}
.hl-glow:nth-of-type(2n){animation-delay:1.4s;}
.hl-glow:nth-of-type(3n){animation-delay:2.9s;}
@keyframes hl-glow{0%,100%{opacity:0;r:2.5;}50%{opacity:0.85;r:4.2;}}
@media(prefers-reduced-motion:reduce){
  .hl-pulse{animation:none;stroke-dasharray:none;opacity:0.2;}
  .hl-glow{animation:none;opacity:0.45;}
}
.hero-wire{
  border:1px solid var(--hair-strong);border-radius:2px;padding:26px 24px;
  background:linear-gradient(180deg, rgba(217,187,111,0.04), rgba(10,26,20,0.4));
  backdrop-filter:blur(6px);
}
.hero-wire-head{
  font-family:var(--mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--gold-300);border-bottom:1px solid var(--hair);padding-bottom:14px;margin-bottom:6px;
  display:flex;justify-content:space-between;align-items:center;
}
.hero-wire-head .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-400);display:inline-block;margin-right:7px;}
.hero-wire-item{padding:14px 0;border-bottom:1px solid var(--hair);}
.hero-wire-item:last-child{border-bottom:none;padding-bottom:0;}
.hero-wire-item time{font-family:var(--mono);font-size:10.5px;color:var(--gold-500);display:block;margin-bottom:5px;letter-spacing:0.02em;}
.hero-wire-item p{font-size:14.5px;line-height:1.42;color:var(--ivory);font-family:var(--body);}
.hero-wire-empty,.hero-wire-loading{font-family:var(--mono);font-size:12px;color:var(--ivory-dim);padding:10px 0 2px;}
@media(max-width:980px){
  .hero-wire{display:none;}
}
.btn-primary{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink);
  background:linear-gradient(180deg,var(--gold-300),var(--gold-500));
  padding:16px 30px;
  box-shadow:0 10px 30px rgba(198,158,74,0.22);
}
.btn-ghost{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ivory);
  border:1px solid var(--hair-strong);
  padding:15px 26px;
  transition:border-color .25s ease, color .25s ease;
}
.btn-ghost:hover{border-color:var(--ivory);color:var(--ivory-dim);}

/* ===== Milestone 186 — Trending Stories (Consumer-Facing Engineering
   Directive §2.1/§3.3). This was the one genuinely confirmed gap in the
   directive's 46-feature checklist — everything else it marked "MISSING"
   already existed (hero, live wire, verification badges, breaking
   banners, dark mode, etc.), stale claims like every prior directive
   audit in this project's history. Wired to a real GET /analytics/trending
   backend route (milestone 186) that ranks real pageview counts — no
   fabricated "velocity score." Honest LIVE/EMPTY states, same contract
   as loadSources()/loadVerificationStats() elsewhere in this file. */
.trending-section{border-bottom:1px solid var(--hair);padding:70px 5vw;}
.trending-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair);margin-top:32px;}
.trending-card{background:var(--emerald-950);padding:22px 20px;position:relative;}
.trending-rank{font-family:var(--mono);font-size:11px;color:var(--gold-400);letter-spacing:0.1em;}
.trending-card h4{font-family:var(--display);font-size:16px;font-weight:500;color:var(--ivory);margin:10px 0 12px;line-height:1.3;}
.trending-velocity{font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);display:flex;align-items:center;gap:6px;}
.trending-velocity .arrow{color:var(--gold-400);}
.trending-empty{font-family:var(--mono);font-size:13px;color:var(--ivory-dim);padding:20px 0 4px;}
.intel-panel{
  border:1px solid var(--hair-strong);
  background:linear-gradient(180deg, rgba(217,187,111,0.03), transparent);
  padding:28px 26px;
  position:relative;
  align-self:start;
}
.intel-panel::before{
  content:'';
  position:absolute;top:-1px;left:-1px;
  width:18px;height:18px;
  border-top:2px solid var(--gold-400);
  border-left:2px solid var(--gold-400);
}
.intel-panel::after{
  content:'';
  position:absolute;bottom:-1px;right:-1px;
  width:18px;height:18px;
  border-bottom:2px solid var(--gold-400);
  border-right:2px solid var(--gold-400);
}
.intel-head{
  display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ivory-dim);
  border-bottom:1px solid var(--hair);
  padding-bottom:14px;margin-bottom:18px;
}
.pulse{width:6px;height:6px;border-radius:50%;background:#8fd6a8;box-shadow:0 0 0 0 rgba(143,214,168,0.5);animation:pulse 2s infinite;}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(143,214,168,0.45);}
  70%{box-shadow:0 0 0 8px rgba(143,214,168,0);}
  100%{box-shadow:0 0 0 0 rgba(143,214,168,0);}
}
.intel-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:13px 0;border-bottom:1px solid var(--hair);
  font-size:14px;
}
.intel-row:last-child{border-bottom:none;}
.intel-row .region{font-family:var(--body);color:var(--ivory);}
.intel-row .val{font-family:var(--mono);font-size:12px;color:var(--ivory-dim);}
.intel-row .val.up{color:#8fd6a8;}
.intel-row .val.down{color:#d98f8f;}

/* ===== fact-check hub ===== */
.fc-hub{
  background:
    radial-gradient(ellipse 1100px 500px at 20% -10%, rgba(217,187,111,0.07), transparent 65%),
    var(--emerald-950);
  border-bottom:1px solid var(--hair-strong);
}
.fc-header{
  display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:30px;
  padding-bottom:40px;margin-bottom:40px;border-bottom:1px solid var(--hair-strong);
}
.fc-header .kicker{display:flex;align-items:center;gap:10px;}
.fc-metrics{display:flex;gap:0;border:1px solid var(--hair-strong);}
.fc-metric{padding:16px 26px;border-right:1px solid var(--hair-strong);text-align:center;}
.fc-metric:last-child{border-right:none;}
.fc-metric .num{font-family:var(--display);font-size:26px;color:var(--ivory-dim);font-weight:500;}
.fc-metric .lbl{font-family:var(--mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ivory-dim);margin-top:4px;}

.fc-search-row{display:flex;gap:16px;margin-bottom:26px;position:relative;}
.fc-search{
  flex:1;position:relative;
}
.fc-search input{
  width:100%;background:var(--emerald-900);border:1px solid var(--hair-strong);
  color:var(--ivory);font-family:var(--body);font-size:15px;padding:16px 20px 16px 46px;
}
.fc-search input:focus{outline:none;border-color:var(--ivory);}
.fc-search input::placeholder{color:var(--ivory-dim);}
.fc-search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);pointer-events:none;}
.fc-suggest{
  position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--emerald-900);
  border:1px solid var(--hair-strong);z-index:50;display:none;
}
.fc-suggest.open{display:block;}
.fc-suggest button{
  display:block;width:100%;text-align:left;background:transparent;border:none;color:var(--ivory-dim);
  font-family:var(--mono);font-size:12.5px;padding:11px 20px;cursor:pointer;border-bottom:1px solid var(--hair);
}
.fc-suggest button:last-child{border-bottom:none;}
.fc-suggest button:hover{background:rgba(217,187,111,0.06);color:var(--ivory-dim);}
.fc-suggest button b{color:var(--ivory-dim);font-weight:500;}

.fc-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px;}
.fc-filter{
  font-family:var(--mono);font-size:11px;letter-spacing:0.05em;
  color:var(--ivory-dim);background:transparent;border:1px solid var(--hair-strong);
  padding:9px 16px;cursor:pointer;display:flex;align-items:center;gap:7px;transition:all .2s ease;
}
.fc-filter:hover{border-color:var(--ivory);color:var(--ivory);}
.fc-filter.active{background:var(--gold-400);border-color:var(--ivory);color:var(--ink);font-weight:500;}

.fc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.fc-card{
  border:1px solid var(--hair-strong);background:var(--emerald-900);padding:26px;
  display:flex;flex-direction:column;gap:14px;position:relative;transition:border-color .25s ease, transform .25s ease;
}
.fc-card:hover{border-color:var(--ivory);transform:translateY(-2px);}
.fc-badge{
  display:inline-flex;align-items:center;gap:6px;width:fit-content;
  font-family:var(--mono);font-size:11px;letter-spacing:0.04em;font-weight:500;
  padding:4px 11px;border-radius:2px;cursor:help;position:relative;
}
.fc-badge.verified{background:rgba(143,214,168,0.14);color:#8fd6a8;border:1px solid rgba(143,214,168,0.3);}
.fc-badge.corroborated{background:rgba(217,187,111,0.14);color:var(--ivory-dim);border:1px solid rgba(217,187,111,0.3);}
.fc-badge.developing{background:rgba(224,184,90,0.14);color:#e0b85a;border:1px solid rgba(224,184,90,0.3);}
.fc-badge.disputed{background:rgba(217,110,110,0.14);color:#e08585;border:1px solid rgba(217,110,110,0.3);}
.fc-badge.unsupported{background:rgba(180,180,175,0.1);color:#b8b6ad;border:1px solid rgba(180,180,175,0.24);}
.fc-badge .tip{
  position:absolute;bottom:calc(100% + 8px);left:0;width:220px;
  background:var(--emerald-950);border:1px solid var(--hair-strong);color:var(--ivory-dim);
  font-family:var(--body);font-size:12px;line-height:1.5;padding:12px 14px;
  opacity:0;visibility:hidden;transition:opacity .2s ease;z-index:20;font-weight:400;
}
.fc-badge:hover .tip,.fc-badge:focus .tip{opacity:1;visibility:visible;}
/* Milestone 91 — Truth Record drawer (Directive v3.0 Sprint 2). Real fields
   only, shown for live claims only — see the JS guard on c.live. */
.fc-tr-toggle{margin-top:10px;background:none;border:1px solid var(--hair-strong);color:var(--ivory-dim);font-family:var(--mono);font-size:10.5px;letter-spacing:0.05em;text-transform:uppercase;padding:5px 10px;cursor:pointer;border-radius:2px;}
.fc-tr-toggle:hover{color:var(--ivory-dim);border-color:var(--ivory);}
.fc-truth-record{margin-top:10px;padding:10px 12px;border-left:2px solid var(--gold-400);background:rgba(217,187,111,0.05);font-size:12px;}
.fc-tr-row{display:flex;justify-content:space-between;gap:10px;padding:3px 0;color:var(--ivory-dim);}
.fc-tr-row span:first-child{font-family:var(--mono);font-size:10px;letter-spacing:0.05em;text-transform:uppercase;opacity:0.75;}
.fc-tr-row code{font-family:var(--mono);font-size:10.5px;color:var(--ivory);}
.fc-evidence-pending{opacity:0.6;font-style:italic;}
.lead-verify{white-space:nowrap;}
/* Milestone 91 — Intelligence Roadmap skeleton cards (Directive v3.0
   Sprint 3). No live data, no fetch calls — deliberately static and
   labeled as such. */
.ir-section{padding:70px 5vw;}
.ir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:32px;}
.ir-card{border:1px solid var(--hair-strong);padding:20px 18px;background:rgba(255,255,255,0.02);}
.ir-status{display:inline-block;font-family:var(--mono);font-size:9.5px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ivory-dim);border:1px solid var(--hair-strong);border-radius:999px;padding:3px 9px;opacity:0.75;margin-bottom:12px;}

/* ===== Audience split (Frontend Directive v8.0 §2 — Dual-Surface Architecture) ===== */
.audience-split{
  display:flex;flex-wrap:wrap;gap:1px;background:var(--hair-strong);
  border-bottom:1px solid var(--hair-strong);
}
.audience-split a{
  flex:1;min-width:220px;text-align:center;padding:13px 18px;
  background:var(--emerald-950);color:var(--ivory-dim);
  font-family:var(--mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;
  text-decoration:none;transition:background .2s ease,color .2s ease;
}
.audience-split a:hover,.audience-split a:focus-visible{background:var(--emerald-900);color:var(--ivory);}
.audience-split a.gov-link{color:var(--ivory-dim);}
.audience-split a.gov-link:hover,.audience-split a.gov-link:focus-visible{color:var(--ivory);}

/* ===== Institutional / Government surface (§2.2) ===== */
.institutional-section{background:var(--emerald-950);border-top:2px solid var(--gold-400);}
.inst-capability-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--hair-strong);margin-top:28px;}
.inst-capability{background:var(--emerald-950);padding:20px 18px;}
.inst-capability .ir-status-live{margin-bottom:10px;}
.inst-capability h5{font-family:var(--display);font-size:15px;color:var(--ivory);margin-bottom:6px;}
.inst-capability p{font-size:12.5px;color:var(--ivory-dim);line-height:1.5;}
.inst-cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;}

.ir-card h4{font-family:var(--display);font-size:16px;color:var(--ivory);margin:0 0 8px;font-weight:500;}
.ir-card p{font-size:12.5px;color:var(--ivory-dim);line-height:1.55;margin:0;}
.ir-status-live{color:var(--ivory,#f4f1e6);border-color:var(--gold,#C9A96E);opacity:1;}
.ci-live-card{border:1px solid var(--gold,#C9A96E);background:rgba(201,169,110,0.04);padding:24px;margin-top:28px;}
.ci-live-head h4{font-family:var(--display);font-size:18px;color:var(--ivory);margin:10px 0 6px;font-weight:500;}
.ci-live-head p{font-size:13px;color:var(--ivory-dim);line-height:1.6;margin:0 0 18px;max-width:640px;}
.ci-search-wrap{position:relative;max-width:var(--content-form);margin-bottom:18px;}
.ci-search-wrap input{width:100%;box-sizing:border-box;background:rgba(255,255,255,0.03);border:1px solid var(--hair-strong);color:var(--ivory);padding:10px 12px;font-family:var(--body);font-size:13.5px;}
.ci-search-wrap input:focus{outline:none;border-color:var(--gold,#C9A96E);}
.ci-search-results{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#0d0d0d;border:1px solid var(--hair-strong);max-height:220px;overflow-y:auto;z-index:5;}
.ci-search-results button{display:block;width:100%;text-align:left;background:none;border:none;color:var(--ivory);padding:9px 12px;font-size:13px;cursor:pointer;font-family:var(--body);}
.ci-search-results button:hover{background:rgba(201,169,110,0.1);}
.ci-search-results .ci-empty{padding:9px 12px;font-size:12.5px;color:var(--ivory-dim);}
.ci-entity-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-family:var(--mono);font-size:12px;color:var(--ivory-dim);}
.ci-entity-header strong{color:var(--ivory);font-family:var(--display);font-size:16px;font-weight:500;}
.ci-primitives-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.ci-prim-card{border:1px solid var(--hair-strong);background:rgba(255,255,255,0.02);padding:16px;}
.ci-prim-card .ci-prim-label{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ivory,#f4f1e6);margin-bottom:8px;}
.ci-prim-card .ci-prim-text{font-size:13px;color:var(--ivory);line-height:1.5;margin:0 0 6px;}
.eg-list{display:flex;flex-direction:column;gap:10px;}
.eg-row{border:1px solid var(--hair-strong);background:rgba(255,255,255,0.02);padding:14px 16px;cursor:pointer;}
.eg-row:hover{border-color:var(--gold,#C9A96E);}
.eg-row-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.eg-row-title{font-family:var(--display);font-size:14.5px;color:var(--ivory);font-weight:500;}
.eg-row-meta{font-family:var(--mono);font-size:10.5px;letter-spacing:0.05em;text-transform:uppercase;color:var(--ivory-dim);white-space:nowrap;}
.eg-row-summary{font-size:12.5px;color:var(--ivory-dim);line-height:1.5;margin:8px 0 0;}
.eg-row-detail{margin-top:12px;padding-top:12px;border-top:1px solid var(--hair-strong);display:none;}
.eg-row.eg-open .eg-row-detail{display:block;}
.eg-detail-block{margin-bottom:10px;}
.eg-detail-label{font-family:var(--mono);font-size:9.5px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ivory,#f4f1e6);margin-bottom:5px;}
.eg-detail-item{font-size:12.5px;color:var(--ivory);line-height:1.5;margin:0 0 4px;}
.eg-tr-toggle{background:none;border:none;color:var(--ivory-dim);font-family:var(--mono);font-size:10.5px;cursor:pointer;padding:0 0 0 4px;text-decoration:underline;}
.eg-tr-drawer{background:rgba(255,255,255,0.02);}
.eg-empty{font-size:12.5px;color:var(--ivory-dim);padding:20px 0;text-align:center;}
.ci-prim-card .ci-prim-text.ci-null{color:var(--ivory-dim);font-style:italic;}
.ci-prim-card .ci-prim-meta{font-size:11px;color:var(--ivory-dim);}

/* ===== Information Constitution (Frontend Directive v2.0 §2.2) =====
   Every piece of information displayed must be classified and visually
   distinguished. This is a real, reusable classification layer — applied
   only to content this codebase already knows the real classification of
   (Fact-Check Hub's own verification states; Digital Twins' own forecast/
   scenario sections), never invented for content with no real backing. */
.ic-badge{
  display:inline-flex;align-items:center;gap:5px;width:fit-content;
  font-family:var(--mono);font-size:9.5px;letter-spacing:0.05em;font-weight:600;
  text-transform:uppercase;padding:3px 9px;border-radius:2px;white-space:nowrap;
}
.ic-badge.ic-fact{background:rgba(143,214,168,0.14);color:#8fd6a8;border:1px solid rgba(143,214,168,0.3);}
.ic-badge.ic-verified-fact{background:rgba(143,214,168,0.16);color:#8fd6a8;border:1px solid rgba(143,214,168,0.4);}
.ic-badge.ic-verified-fact::before{content:'🔒';font-size:9px;}
.ic-badge.ic-corroborated-fact{background:rgba(217,187,111,0.16);color:var(--ivory-dim);border:1px solid rgba(217,187,111,0.4);}
.ic-badge.ic-disputed-claim{background:rgba(217,110,110,0.16);color:#e08585;border:1px solid rgba(217,110,110,0.4);}
.ic-badge.ic-disputed-claim::before{content:'⚠';font-size:10px;}
.ic-badge.ic-unverified-report{background:rgba(180,180,175,0.12);color:#b8b6ad;border:1px solid rgba(180,180,175,0.28);}
.ic-badge.ic-unverified-report::after{content:'· pending';font-weight:400;text-transform:none;opacity:0.75;}
.ic-badge.ic-analysis{background:transparent;color:var(--ivory-dim);border:1px solid var(--hair-strong);font-style:italic;text-transform:none;}
.ic-badge.ic-forecast{background:rgba(168,143,214,0.14);color:#c3aef0;border:1px solid rgba(168,143,214,0.32);}
.ic-badge.ic-scenario{background:transparent;color:var(--ivory-dim);border:1px dashed var(--hair-strong);}
.ic-badge.ic-opinion{background:transparent;color:var(--ivory-dim);border:1px solid var(--gold-400);text-transform:none;font-style:italic;}
.ic-badge.ic-ai-generated{background:rgba(168,143,214,0.1);color:#c3aef0;border:1px solid rgba(168,143,214,0.35);}
.ic-badge.ic-human-reviewed{background:rgba(122,163,214,0.12);color:#8fb4e0;border:1px solid rgba(122,163,214,0.35);}
.ic-badge.ic-historical{background:transparent;color:var(--ivory-dim);border:1px solid var(--hair);opacity:0.85;}

.fc-card h4{font-family:var(--display);font-size:18px;font-weight:500;color:var(--ivory);line-height:1.35;}
.fc-evidence{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);display:flex;flex-direction:column;gap:5px;}
.fc-evidence li{list-style:none;display:flex;gap:8px;align-items:baseline;}
.fc-evidence li::before{content:'›';color:var(--ivory);}
.fc-card-foot{
  display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:14px;
  border-top:1px solid var(--hair);
}
.fc-confidence{display:flex;align-items:center;gap:8px;}
.fc-confidence .bar{width:60px;height:4px;background:var(--hair-strong);position:relative;}
.fc-confidence .bar span{position:absolute;left:0;top:0;bottom:0;background:var(--gold-400);}
.fc-confidence .pct{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);}
.fc-chain{font-family:var(--mono);font-size:9.5px;color:var(--ivory-dim);display:flex;align-items:center;gap:5px;}
.fc-chain svg{opacity:0.7;}

.fc-empty{
  display:none;text-align:center;padding:70px 20px;border:1px dashed var(--hair-strong);
}
.fc-empty.show{display:block;}
.fc-empty p{font-family:var(--body);color:var(--ivory-dim);margin-top:10px;font-size:15px;}
.fc-empty .title{font-family:var(--display);font-size:20px;color:var(--ivory);}

.fc-api-note{
  margin-top:36px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;
  padding:20px 24px;border:1px solid var(--hair-strong);background:var(--emerald-900);
}
.fc-api-note .txt{font-family:var(--mono);font-size:11.5px;color:var(--ivory-dim);letter-spacing:0.02em;}
.fc-api-note code{color:var(--ivory-dim);}
.fc-api-note a{
  font-family:var(--mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink);
  background:linear-gradient(180deg,var(--gold-300),var(--gold-500));padding:10px 18px;flex-shrink:0;
}

@media(max-width:980px){
  .fc-grid{grid-template-columns:1fr 1fr;}
  .fc-metrics{width:100%;}
  .fc-metric{flex:1;padding:14px 10px;}
}
@media(max-width:640px){
  .fc-grid{grid-template-columns:1fr;}
}

/* ===== knowledge graph ===== */
.kg-hub{padding:96px 5vw;border-bottom:1px solid var(--hair);}
.kg-metrics{display:flex;gap:28px;flex-wrap:wrap;}
.kg-metric{border-left:2px solid var(--gold-400);padding:2px 0 2px 14px;}
.kg-metric .num{font-family:var(--display);font-size:26px;color:var(--ivory-dim);font-weight:500;}
.kg-metric .lbl{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ivory-dim);margin-top:2px;}

.kg-types{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px;}
.kg-type{
  border:1px solid var(--hair-strong);padding:18px 16px;cursor:pointer;background:var(--emerald-900);
  transition:border-color .15s,transform .15s;
}
.kg-type:hover,.kg-type.active{border-color:var(--ivory);transform:translateY(-2px);}
.kg-type.active{background:rgba(217,187,111,0.08);}
.kg-type .glyph{font-family:var(--display);font-size:20px;color:var(--ivory-dim);}
.kg-type h5{font-family:var(--body);font-size:14.5px;font-weight:600;color:var(--ivory);margin-top:10px;}
.kg-type .bbid{font-family:var(--mono);font-size:9.5px;letter-spacing:0.02em;color:var(--ivory-dim);margin-top:6px;word-break:break-all;}

.kg-panel{
  margin-top:40px;border:1px solid var(--hair-strong);background:var(--emerald-900);
  display:grid;grid-template-columns:1.1fr 1.4fr;
}
.kg-panel-left{padding:28px;border-right:1px solid var(--hair);}
.kg-panel-right{padding:28px;}
.kg-ic-note{
  margin-top:16px;padding:10px 14px;border-left:2px solid var(--hair-strong);
  font-family:var(--body);font-size:11.5px;color:var(--ivory-dim);line-height:1.55;opacity:0.85;
}
.kg-entity-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.kg-entity-head h3{font-family:var(--display);font-size:22px;font-weight:500;color:var(--ivory);}
.kg-entity-head .bbid-tag{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);background:rgba(217,187,111,0.1);border:1px solid var(--hair-strong);padding:4px 8px;white-space:nowrap;}
.kg-entity-meta{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);margin-top:6px;letter-spacing:0.02em;}
.kg-wikidata{
  display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-family:var(--mono);font-size:10.5px;
  color:var(--ivory-dim);border:1px solid rgba(217,187,111,0.35);background:rgba(217,187,111,0.08);padding:6px 10px;
}
.kg-wikidata .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-400);}

.kg-subhead{font-family:var(--mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);margin:22px 0 12px;}
.kg-rel-list{display:flex;flex-direction:column;gap:10px;}
.kg-rel{display:flex;align-items:center;gap:10px;font-family:var(--body);font-size:13.5px;color:var(--ivory-dim);}
.kg-rel .rel-type{font-family:var(--mono);font-size:10px;letter-spacing:0.04em;text-transform:uppercase;color:var(--ivory-dim);border:1px solid var(--hair-strong);padding:3px 7px;flex-shrink:0;}
.kg-rel .rel-target{color:var(--ivory);}
.kg-rel .rel-conf{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);flex-shrink:0;}
.kg-conf-bar{width:56px;height:3px;background:rgba(217,187,111,0.15);position:relative;flex-shrink:0;}
.kg-conf-bar span{position:absolute;left:0;top:0;bottom:0;background:var(--gold-400);}

.kg-timeline{position:relative;padding-left:20px;}
.kg-timeline::before{content:'';position:absolute;left:4px;top:4px;bottom:4px;width:1px;background:var(--hair-strong);}
.kg-tl-item{position:relative;padding-bottom:18px;}
.kg-tl-item::before{content:'';position:absolute;left:-19px;top:4px;width:7px;height:7px;border-radius:50%;background:var(--gold-400);}
.kg-tl-item .date{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);letter-spacing:0.04em;}
.kg-tl-item .txt{font-family:var(--body);font-size:13.5px;color:var(--ivory-dim);margin-top:3px;line-height:1.5;}

.kg-commits{display:flex;flex-direction:column;gap:0;}
.kg-commit{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--hair);}
.kg-commit:last-child{border-bottom:none;}
.kg-commit .hash{font-family:var(--mono);font-size:11px;color:var(--ivory);flex-shrink:0;}
.kg-commit .msg{font-family:var(--body);font-size:13px;color:var(--ivory-dim);}
.kg-commit .meta{font-family:var(--mono);font-size:9.5px;color:var(--ivory-dim);opacity:0.6;margin-top:2px;}

.kg-related{display:flex;flex-wrap:wrap;gap:8px;}
.kg-related button{
  font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);border:1px solid var(--hair-strong);
  background:transparent;padding:6px 10px;cursor:pointer;transition:border-color .15s,color .15s;
}
.kg-related button:hover{border-color:var(--ivory);color:var(--ivory-dim);}

.kg-tabs{display:flex;gap:2px;border-bottom:1px solid var(--hair-strong);margin-bottom:20px;flex-wrap:wrap;}
.kg-tab{
  font-family:var(--mono);font-size:10.5px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ivory-dim);
  background:transparent;border:none;padding:10px 14px;cursor:pointer;border-bottom:2px solid transparent;
}
.kg-tab:hover{color:var(--ivory);}
.kg-tab.active{color:var(--ivory-dim);border-bottom-color:var(--ivory);}
.kg-tabpage{display:none;}
.kg-tabpage.active{display:block;}

.kg-feature-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--hair-strong);margin-top:44px;border:1px solid var(--hair-strong);}
.kg-feature{background:var(--emerald-950);padding:16px 14px;}
.kg-feature .n{font-family:var(--mono);font-size:9.5px;color:var(--ivory-dim);letter-spacing:0.06em;}
.kg-feature h6{font-family:var(--body);font-size:12.5px;font-weight:600;color:var(--ivory);margin-top:8px;line-height:1.3;}

@media(max-width:980px){
  .kg-types{grid-template-columns:repeat(2,1fr);}
  .kg-panel{grid-template-columns:1fr;}
  .kg-panel-left{border-right:none;border-bottom:1px solid var(--hair);}
  .kg-feature-strip{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:640px){
  .kg-types{grid-template-columns:1fr 1fr;}
}

/* ===== urgency system ===== */
:root{
  --u-flash:#e14b4b;
  --u-breaking:#e08a3f;
  --u-developing:#e0b85a;
  --u-regular:#9a978d;
}
.u-badge{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:0.08em;text-transform:uppercase;font-weight:600;
  padding:4px 10px;border-radius:2px;
}
.u-badge.flash{background:rgba(225,75,75,0.16);color:var(--u-flash);border:1px solid rgba(225,75,75,0.4);}
.u-badge.breaking{background:rgba(224,138,63,0.16);color:var(--u-breaking);border:1px solid rgba(224,138,63,0.4);}
.u-badge.developing{background:rgba(224,184,90,0.16);color:var(--u-developing);border:1px solid rgba(224,184,90,0.4);}
.u-badge.regular{background:rgba(154,151,141,0.14);color:var(--u-regular);border:1px solid rgba(154,151,141,0.3);}

/* breaking banner */
.breaking-banner{
  position:relative;background:var(--emerald-900);border-bottom:1px solid var(--hair-strong);
  display:flex;align-items:center;gap:16px;padding:12px 5vw;
  transition:transform .3s ease, opacity .3s ease;
}
.breaking-banner.hidden{transform:translateY(-100%);opacity:0;height:0;padding:0;overflow:hidden;border:none;}
.breaking-banner .u-badge.flash{animation:flash-glow 1.4s ease-in-out infinite;}
@keyframes flash-glow{
  0%,100%{box-shadow:0 0 0 0 rgba(225,75,75,0.35);}
  50%{box-shadow:0 0 0 5px rgba(225,75,75,0);}
}
.breaking-text{
  font-family:var(--body);font-size:14.5px;color:var(--ivory);flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.breaking-time{font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);flex-shrink:0;}
.breaking-close{
  background:transparent;border:none;color:var(--ivory-dim);cursor:pointer;font-size:16px;line-height:1;
  flex-shrink:0;padding:4px;
}
.breaking-close:hover{color:var(--ivory-dim);}

/* live section */
.live-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:0;border:1px solid var(--hair-strong);}
.live-video{position:relative;aspect-ratio:16/9;background:#010e0a;overflow:hidden;}
.live-video .frame-fill{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 30% 30%, rgba(217,187,111,0.08), transparent 60%),
    repeating-linear-gradient(115deg, #061c15, #061c15 2px, #04140f 2px, #04140f 4px);
}
.live-top{position:absolute;top:0;left:0;right:0;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;
  background:linear-gradient(180deg, rgba(0,0,0,0.7), transparent);}
.live-badge{
  display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;letter-spacing:0.08em;font-weight:600;
  color:#fff;background:var(--u-flash);padding:5px 10px;border-radius:2px;
}
.live-dot{width:6px;height:6px;border-radius:50%;background:#fff;animation:pulse 1.6s infinite;}
.viewer-count{font-family:var(--mono);font-size:11.5px;color:var(--ivory);background:rgba(0,0,0,0.45);padding:5px 10px;border-radius:2px;letter-spacing:0.03em;}
.live-controls{
  position:absolute;bottom:0;left:0;right:0;padding:16px 18px 14px;
  background:linear-gradient(0deg, rgba(0,0,0,0.8), transparent);
  display:flex;flex-direction:column;gap:10px;
}
.live-progress{width:100%;height:4px;background:rgba(255,255,255,0.2);position:relative;cursor:pointer;}
.live-progress .fill{position:absolute;left:0;top:0;bottom:0;background:var(--gold-400);width:100%;}
.live-btm-row{display:flex;justify-content:space-between;align-items:center;}
.live-btns{display:flex;align-items:center;gap:14px;}
.live-btn{background:transparent;border:none;color:var(--ivory);cursor:pointer;display:flex;align-items:center;}
.live-btn:hover{color:var(--ivory-dim);}
.live-timestamp{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);}

.live-side{background:var(--emerald-900);padding:24px;border-left:1px solid var(--hair-strong);display:flex;flex-direction:column;}
.live-side-head{
  font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);
  margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--hair);
}
.alert-stream{display:flex;flex-direction:column;gap:0;max-height:420px;overflow-y:auto;}
.alert-item{padding:14px 0;border-bottom:1px solid var(--hair);}
.alert-item:last-child{border-bottom:none;}
.alert-item h5{font-family:var(--display);font-size:14.5px;font-weight:500;color:var(--ivory);line-height:1.35;margin-top:8px;}
.alert-item .meta{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);margin-top:6px;}

/* alerts management */
.alerts-panel{display:grid;grid-template-columns:1fr 1.3fr;gap:0;border:1px solid var(--hair-strong);}
.prefs-col{padding:34px;border-right:1px solid var(--hair-strong);}
.prefs-group{margin-bottom:30px;}
.prefs-group:last-child{margin-bottom:0;}
.prefs-label{font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:14px;}
.pref-row{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--hair);}
.pref-row:last-child{border-bottom:none;}
.pref-row .name{font-family:var(--body);font-size:14.5px;color:var(--ivory);display:flex;align-items:center;gap:9px;}
.switch{position:relative;width:38px;height:20px;flex-shrink:0;}
.switch input{opacity:0;width:0;height:0;}
.switch .track{position:absolute;inset:0;background:var(--hair-strong);border-radius:20px;cursor:pointer;transition:background .2s ease;}
.switch .track::before{content:'';position:absolute;left:2px;top:2px;width:16px;height:16px;background:var(--ivory-dim);border-radius:50%;transition:transform .2s ease, background .2s ease;}
.switch input:checked + .track{background:rgba(217,187,111,0.35);}
.switch input:checked + .track::before{transform:translateX(18px);background:var(--gold-400);}
.topic-chip-row{display:flex;flex-wrap:wrap;gap:8px;}
.topic-chip{
  font-family:var(--mono);font-size:10.5px;letter-spacing:0.03em;color:var(--ivory-dim);
  border:1px solid var(--hair-strong);padding:7px 13px;cursor:pointer;transition:all .2s ease;
}
.topic-chip.active{background:var(--gold-400);color:var(--ink);border-color:var(--ivory);font-weight:500;}
.quiet-hours{display:flex;gap:12px;align-items:center;}
.quiet-hours input[type=time]{
  background:var(--emerald-950);border:1px solid var(--hair-strong);color:var(--ivory);
  font-family:var(--mono);font-size:12px;padding:8px 10px;
}
.quiet-hours span{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);}

.history-col{padding:34px;display:flex;flex-direction:column;}
.history-search{
  width:100%;background:var(--emerald-950);border:1px solid var(--hair-strong);color:var(--ivory);
  font-family:var(--mono);font-size:12.5px;padding:11px 14px;margin-bottom:16px;
}
.history-search:focus{outline:none;border-color:var(--ivory);}
.history-list{overflow-y:auto;max-height:440px;}
.history-row{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--hair);align-items:flex-start;}
.history-row .h-text{flex:1;}
.history-row h6{font-family:var(--display);font-size:14px;font-weight:500;color:var(--ivory);line-height:1.3;}
.history-row .meta{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);margin-top:5px;}
.history-empty{padding:30px 0;text-align:center;font-family:var(--mono);font-size:11.5px;color:var(--ivory-dim);}

@media(max-width:980px){
  .live-grid{grid-template-columns:1fr;}
  .live-side{border-left:none;border-top:1px solid var(--hair-strong);}
  .alerts-panel{grid-template-columns:1fr;}
  .prefs-col{border-right:none;border-bottom:1px solid var(--hair-strong);}
}

/* ===== section framework ===== */
section{padding:100px 5vw;position:relative;}
.section-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:56px;padding-bottom:22px;border-bottom:1px solid var(--hair-strong);
  gap:40px;flex-wrap:wrap;
}
.section-head .kicker{
  font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:12px;display:block;
}
.section-head h2{
  font-family:var(--display);font-weight:500;font-size:clamp(28px,3vw,40px);color:var(--ivory);line-height:1.1;max-width:20ch;
}
.section-head .desc{
  font-family:var(--body);font-size:15.5px;color:var(--ivory-dim);max-width:36ch;line-height:1.6;
}

/* ===== editorial grid (bureaus) ===== */
.bureaus{
  display:grid;grid-template-columns:repeat(5,1fr);gap:1px;
  background:var(--hair-strong);
  border:1px solid var(--hair-strong);
}
.bureau{
  background:var(--emerald-950);padding:34px 26px;transition:background .3s ease;
}
.bureau:hover{background:var(--emerald-900);}
.bureau .num{font-family:var(--mono);font-size:11px;color:var(--ivory);letter-spacing:0.1em;}
.bureau h3{
  font-family:var(--display);font-size:22px;font-weight:500;color:var(--ivory);margin:16px 0 12px;
}
.bureau p{font-size:14.5px;line-height:1.6;color:var(--ivory-dim);}
.bureau .loc{
  margin-top:20px;font-family:var(--mono);font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ivory-dim);
  display:flex;align-items:center;gap:8px;
}

/* ===== capability tiers (pillars) ===== */
.pillars{background:var(--emerald-900);}
.pillar-list{display:flex;flex-direction:column;border-top:1px solid var(--hair-strong);}
.pillar{
  display:grid;grid-template-columns:120px 1fr 1fr;gap:40px;
  padding:36px 0;border-bottom:1px solid var(--hair);
  align-items:start;
}
.pillar .roman{font-family:var(--display);font-size:15px;color:var(--ivory);letter-spacing:0.05em;padding-top:4px;}
.pillar h4{font-family:var(--display);font-weight:500;font-size:24px;color:var(--ivory);margin-bottom:10px;}
.pillar h4 span{color:var(--ivory-dim);font-style:italic;font-weight:400;}
.pillar .p-desc{font-size:15px;line-height:1.65;color:var(--ivory-dim);}
.pillar .p-detail{font-family:var(--mono);font-size:12px;line-height:2;color:var(--ivory-dim);}
.pillar .p-detail li{list-style:none;display:flex;gap:10px;}
.pillar .p-detail li::before{content:'—';color:var(--ivory);}

/* ===== institutional offerings (expanded) ===== */
.io-section{background:var(--emerald-950);}
.io-legend{display:flex;gap:20px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;color:var(--ivory-dim);margin-top:14px;}
.io-legend span{display:inline-flex;align-items:center;gap:6px;}
.io-dot{width:7px;height:7px;border-radius:50%;display:inline-block;}
.io-dot.live{background:#3fae72;}
.io-dot.offering{background:var(--gold-400);}
.io-grid{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--hair-strong);margin-top:30px;}
.io-pillar{border-bottom:1px solid var(--hair);padding:32px 0;}
.io-pillar-head{display:flex;align-items:baseline;gap:16px;margin-bottom:16px;}
.io-pillar-num{font-family:var(--mono);font-size:12px;color:var(--ivory);letter-spacing:0.08em;}
.io-pillar-head h4{font-family:var(--display);font-weight:500;font-size:21px;color:var(--ivory);}
.io-pillar-desc{font-size:13.5px;color:var(--ivory-dim);line-height:1.6;margin-bottom:18px;max-width:70ch;}
.io-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px 24px;}
.io-item{display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:1.55;color:var(--ivory-dim);padding:8px 0;border-bottom:1px solid rgba(217,187,111,0.08);}
.io-item .io-status{flex-shrink:0;margin-top:5px;}
.io-item b{color:var(--ivory);font-weight:500;display:block;font-size:13.5px;}
.io-item .io-badge{font-family:var(--mono);font-size:9.5px;letter-spacing:0.06em;text-transform:uppercase;padding:1px 6px;border-radius:3px;margin-left:6px;vertical-align:1px;}
.io-badge.live{color:#3fae72;border:1px solid rgba(63,174,114,0.4);background:rgba(63,174,114,0.08);}
.io-badge.offering{color:var(--ivory-dim);border:1px solid rgba(217,187,111,0.35);background:rgba(217,187,111,0.06);}
@media(max-width:760px){.io-items{grid-template-columns:1fr;}}

/* ===== trust strip ===== */
.trust{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:30px;
  padding:56px 5vw;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);
  background:var(--emerald-950);
}
.trust-item{display:flex;align-items:center;gap:14px;}
.trust-item .mark{
  width:34px;height:34px;border:1px solid var(--gold-400);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-family:var(--display);color:var(--ivory-dim);font-size:15px;
}
.trust-item span{font-family:var(--mono);font-size:11px;letter-spacing:0.06em;color:var(--ivory-dim);text-transform:uppercase;}

/* ===== dispatch feed (editorial) ===== */
.feed{display:grid;grid-template-columns:2fr 1px 1fr;gap:0;}
.feed-main{padding-right:56px;}
.feed-div{background:var(--hair-strong);}
.feed-side{padding-left:56px;}
.lead-story{border-bottom:1px solid var(--hair);padding-bottom:36px;margin-bottom:36px;}
.tag{
  font-family:var(--mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);
  border:1px solid var(--hair-strong);padding:4px 10px;display:inline-block;margin-bottom:16px;
}
.lead-story h3{font-family:var(--display);font-weight:500;font-size:34px;line-height:1.12;color:var(--ivory);margin-bottom:14px;}
.lead-story p{font-size:16px;line-height:1.7;color:var(--ivory-dim);max-width:56ch;}
.lead-meta{margin-top:20px;font-family:var(--mono);font-size:11px;color:var(--ivory-dim);letter-spacing:0.04em;}
.story-row{display:flex;gap:22px;padding:22px 0;border-bottom:1px solid var(--hair);}
.story-row .idx{font-family:var(--mono);font-size:12px;color:var(--ivory);padding-top:3px;}
.story-row h4{font-family:var(--display);font-size:17px;font-weight:500;color:var(--ivory);line-height:1.3;margin-bottom:6px;}
.story-row .meta{font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);letter-spacing:0.04em;}
.side-head{font-family:var(--mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:24px;}
.side-item{padding:18px 0;border-bottom:1px solid var(--hair);}
.side-item h5{font-family:var(--display);font-size:16px;font-weight:500;color:var(--ivory);line-height:1.3;}
.side-item .meta{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);margin-top:8px;letter-spacing:0.04em;}

/* ===== cta banner ===== */
.cta-banner{
  text-align:center;padding:130px 5vw;position:relative;
  background:
    radial-gradient(ellipse 1000px 500px at 50% 0%, rgba(217,187,111,0.08), transparent 70%),
    var(--emerald-900);
  border-top:1px solid var(--hair-strong);border-bottom:1px solid var(--hair-strong);
}
.cta-banner .kicker{font-family:var(--mono);font-size:11px;letter-spacing:0.2em;color:var(--ivory-dim);text-transform:uppercase;}
.cta-banner h2{
  font-family:var(--display);font-weight:500;font-size:clamp(32px,4.4vw,58px);color:var(--ivory);
  max-width:18ch;margin:24px auto 36px;line-height:1.08;
}
.cta-banner h2 em{color:var(--ivory-dim);font-style:italic;font-weight:400;}
.cta-row{display:flex;gap:20px;justify-content:center;}

/* ===== cookie consent ===== */
.cookie-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:900;
  background:var(--emerald-950);border-top:1px solid var(--hair-strong);
  padding:20px 5vw;display:flex;align-items:center;gap:24px;flex-wrap:wrap;
  transform:translateY(100%);opacity:0;transition:transform var(--dur-modal) var(--ease-modal),opacity var(--dur-modal) var(--ease-modal);
}
.cookie-banner.show{transform:translateY(0);opacity:1;}
.cookie-banner p{font-size:13px;color:var(--ivory-dim);line-height:1.6;max-width:64ch;flex:1;min-width:240px;}
.cookie-banner p a{color:var(--ivory-dim);text-decoration:underline;}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;}
.cookie-btn{font-family:var(--mono);font-size:11.5px;letter-spacing:0.06em;padding:10px 18px;border-radius:4px;cursor:pointer;white-space:nowrap;border:1px solid var(--hair-strong);background:transparent;color:var(--ivory-dim);transition:all .2s ease;}
.cookie-btn:hover{border-color:var(--ivory);color:var(--ivory);}
.cookie-btn.primary{background:var(--gold-400);border-color:var(--ivory);color:var(--emerald-950);}
.cookie-btn.primary:hover{background:var(--gold-300);}
.cookie-modal-backdrop{position:fixed;inset:0;background:rgba(4,36,28,0.7);z-index:950;opacity:0;visibility:hidden;transition:opacity var(--dur-modal) var(--ease-modal);}
.cookie-modal-backdrop.open{opacity:1;visibility:visible;}
.cookie-modal{
  position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(0.96);z-index:960;
  width:min(560px,92vw);max-height:80vh;overflow-y:auto;
  background:var(--emerald-900);border:1px solid var(--hair-strong);border-radius:8px;padding:32px;
  opacity:0;visibility:hidden;transition:opacity var(--dur-modal) var(--ease-modal),transform var(--dur-modal) var(--ease-modal);
}
.cookie-modal.open{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1);}
.cookie-modal h3{font-family:var(--display);font-weight:500;font-size:20px;color:var(--ivory);margin-bottom:8px;}
.cookie-modal>p{font-size:13px;color:var(--ivory-dim);line-height:1.6;margin-bottom:20px;}
.cookie-pref-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:16px 0;border-top:1px solid var(--hair);}
.cookie-pref-row:first-of-type{border-top:none;}
.cookie-pref-row .label{font-family:var(--mono);font-size:12.5px;letter-spacing:0.04em;color:var(--ivory);margin-bottom:4px;}
.cookie-pref-row .desc{font-size:12px;color:var(--ivory-dim);line-height:1.5;max-width:38ch;}
.cookie-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px;}
.tm{font-size:0.55em;vertical-align:super;letter-spacing:0;margin-left:1px;color:var(--ivory-dim);opacity:0.85;}

/* ===== footer ===== */
footer{padding:70px 5vw 34px;background:var(--emerald-950);}
.footer-legal{padding:28px 0;border-bottom:1px solid var(--hair);}
.footer-legal h6{font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:14px;}
.footer-legal p{font-size:12px;color:var(--ivory-dim);line-height:1.7;max-width:78ch;}
.footer-marks{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:14px;font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);letter-spacing:0.02em;}
.footer-marks span{white-space:nowrap;}
.footer-marks span b{color:var(--ivory-dim);font-weight:500;}
.footer-grid{display:grid;grid-template-columns:1.15fr 0.9fr 0.9fr 1.1fr;gap:38px;padding-bottom:50px;border-bottom:1px solid var(--hair);}
.footer-brand .name{font-family:var(--display);font-weight:600;font-size:20px;color:var(--ivory);}
.footer-brand p{font-size:14px;color:var(--ivory-dim);margin-top:16px;line-height:1.6;max-width:32ch;}
.footer-col h6{font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:18px;}
.footer-col a{display:block;font-size:14px;color:var(--ivory-dim);margin-bottom:12px;transition:color .2s ease;}
.footer-col a:hover{color:var(--ivory-dim);}
.footer-bottom{
  display:flex;justify-content:space-between;padding-top:26px;flex-wrap:wrap;gap:14px;
  font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);letter-spacing:0.04em;
}

/* ===== responsive ===== */
@media(max-width:1240px){
  .bureaus{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:980px){
  .nav{display:none;}
  .hero{grid-template-columns:1fr;}
  .hero::after{display:none;}
  .bureaus{grid-template-columns:repeat(2,1fr);}
  .pillar{grid-template-columns:1fr;gap:14px;}
  .feed{grid-template-columns:1fr;}
  .feed-div{display:none;}
  .feed-side{padding-left:0;margin-top:50px;}
  .feed-main{padding-right:0;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:560px){
  .footer-grid{grid-template-columns:1fr;}
  .bureaus{grid-template-columns:1fr;}
  section{padding:70px 6vw;}
}

@media(prefers-reduced-motion:reduce){
  .wire-track{animation:none;}
  .pulse{animation:none;}
  html{scroll-behavior:auto;}
  .ripple-el::after{transition:none !important;}
  .spinner-ring{animation:none;border-top-color:var(--ivory);}
  .toast-notify{transition:opacity .01ms !important;}
}

/* =========================================================
   SECTION 5 — MOTION & MICRO-INTERACTIONS (Sovereign Presence)
   Purposeful · Subtle · Responsive · Consistent · Performant
   ========================================================= */

/* ---- global consistent motion language ---- */
a,button,.btn-primary,.btn-ghost,.nl-tier,.dev-tier,.twin-card,
.switch,.topic-chip,.bottom-nav-item,.theme-toggle,.nav-toggle{
  transition:color var(--dur-hover) var(--ease-out),
             border-color var(--dur-hover) var(--ease-out),
             background var(--dur-hover) var(--ease-out),
             transform var(--dur-hover) var(--ease-out),
             box-shadow var(--dur-hover) var(--ease-out);
}

/* ---- hover: card highlight in champagne gold, 200ms ease-out ---- */
.twin-card,.dev-tier,.nl-tier{will-change:transform;}
.twin-card:hover,.dev-tier:hover{
  box-shadow:inset 0 0 0 1px var(--gold-400);
  transform:translateY(-2px);
}

/* ---- click: scale + champagne gold flash, works on any element with .ripple-el ---- */
.ripple-el{position:relative;overflow:hidden;}
.ripple-el::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(circle at var(--rx,50%) var(--ry,50%), var(--focus-flash) 0%, transparent 60%);
  opacity:0;transform:scale(.85);
  transition:opacity var(--dur-hover) var(--ease-out), transform var(--dur-hover) var(--ease-out);
  pointer-events:none;
}
.ripple-el:active::after{opacity:1;transform:scale(1.15);}
.ripple-el:active{transform:scale(0.98);}

/* ---- page transition: sovereign emerald fade on section reveal ---- */
.reveal{opacity:0;transform:translateY(14px);
  transition:opacity var(--dur-page) var(--ease-standard), transform var(--dur-page) var(--ease-standard);
}
.reveal.in-view{opacity:1;transform:translateY(0);}

/* ---- loading: sovereign emerald spinner ---- */
.spinner-ring{
  display:inline-block;width:22px;height:22px;flex-shrink:0;
  border:2.5px solid var(--hair-strong);border-top-color:var(--ivory);
  border-radius:50%;animation:spin-ring var(--dur-spin) linear infinite;
}
@keyframes spin-ring{to{transform:rotate(360deg);}}

/* ---- loading: champagne gold skeleton ---- */
.skeleton{
  position:relative;overflow:hidden;background:var(--emerald-850);
  border-radius:2px;
}
.skeleton::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,var(--hair-strong),transparent);
  animation:skeleton-sweep 1.4s ease-in-out infinite;
}
@keyframes skeleton-sweep{
  0%{transform:translateX(-100%);}
  100%{transform:translateX(100%);}
}

/* ---- notification: slide in from top with champagne gold glow, 400ms ease-out ---- */
.toast-notify{
  position:fixed;top:18px;left:50%;z-index:600;
  display:flex;align-items:center;gap:10px;
  background:var(--emerald-900);border:1px solid var(--gold-400);
  box-shadow:0 0 0 1px var(--hair), 0 10px 30px rgba(0,0,0,0.35), 0 0 22px var(--focus-flash);
  color:var(--ivory);font-family:var(--mono);font-size:12px;letter-spacing:0.02em;
  padding:12px 18px;border-radius:2px;
  opacity:0;transform:translate(-50%,-16px);
  transition:opacity var(--dur-notify) var(--ease-out), transform var(--dur-notify) var(--ease-out);
  pointer-events:none;
}
.toast-notify.show{opacity:1;transform:translate(-50%,0);pointer-events:auto;}
.toast-notify .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-400);flex-shrink:0;
  box-shadow:0 0 8px var(--gold-400);}

/* ---- modal: scale + fade with champagne gold accent, 250ms cubic-bezier ---- */
.modal-backdrop{
  position:fixed;inset:0;z-index:700;background:rgba(4,36,28,0.72);
  opacity:0;visibility:hidden;transition:opacity var(--dur-modal) var(--ease-modal), visibility var(--dur-modal);
}
.modal-backdrop.open{opacity:1;visibility:visible;}
.modal-panel{
  background:var(--emerald-900);border:1px solid var(--gold-400);
  box-shadow:0 20px 60px rgba(0,0,0,0.5), 0 0 0 1px var(--hair);
  transform:scale(.94);opacity:0;
  transition:transform var(--dur-modal) var(--ease-modal), opacity var(--dur-modal) var(--ease-modal);
}
.modal-backdrop.open .modal-panel{transform:scale(1);opacity:1;}

/* ---- Article detail modal (Frontend Directive §"Article Presentation") ---- */
#articleModalPanel{max-width:720px;width:92%;max-height:84vh;overflow-y:auto;padding:36px 40px;border-radius:2px;}

/* ---- Twin history/trend modal (Milestone 121) ---- */
#twinModalPanel{max-width:640px;width:92%;max-height:84vh;overflow-y:auto;padding:32px 36px;border-radius:2px;}
.twin-card{cursor:pointer;transition:transform .18s ease,border-color .18s ease;}
.twin-card:hover{transform:translateY(-2px);border-color:var(--ivory);}
.tt-head{border-bottom:1px solid var(--hair);padding-bottom:14px;margin-bottom:16px;}
.tt-head .kind{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ivory);}
.tt-head h2{margin:6px 0 0;font-size:22px;}
.twin-timeline{position:relative;padding-left:20px;}
.twin-timeline::before{content:'';position:absolute;left:5px;top:4px;bottom:4px;width:1px;background:var(--hair);}
.tt-event{position:relative;padding:0 0 20px 16px;}
.tt-event::before{content:'';position:absolute;left:-19px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--gold-400);box-shadow:0 0 0 3px var(--emerald-900);}
.tt-event:last-child{padding-bottom:0;}
.tt-event .tt-when{font-size:11px;letter-spacing:.05em;text-transform:uppercase;opacity:.6;margin-bottom:4px;}
.tt-event .tt-state{font-weight:600;font-size:15px;margin-bottom:6px;}
.tt-event .tt-row{font-size:13px;line-height:1.5;margin-bottom:2px;opacity:.9;}
.tt-event .tt-row b{opacity:.65;font-weight:500;margin-right:4px;}
.tt-empty{opacity:.7;font-size:14px;padding:8px 0;}
#articleModalPanel .am-eyebrow{font-family:var(--font-mono,monospace);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ivory);}
#articleModalPanel .am-headline{font-size:28px;line-height:1.15;margin:10px 0 8px;color:var(--text-primary,#f5f0e6);}
#articleModalPanel .am-subheadline{font-size:16px;font-style:italic;opacity:.85;margin:0 0 14px;}
#articleModalPanel .am-meta{font-family:var(--font-mono,monospace);font-size:12px;opacity:.65;margin-bottom:18px;}
#articleModalPanel .am-hero{width:100%;max-height:70vh;object-fit:contain;margin-bottom:18px;border:1px solid var(--hair);}
#articleModalPanel .am-video{width:100%;max-height:360px;margin-bottom:18px;border:1px solid var(--hair);background:#000;}
#articleModalPanel .am-hero-credit{font-size:11px;opacity:.55;margin:-14px 0 16px;}
#articleModalPanel .am-body{font-size:15px;line-height:1.7;white-space:pre-wrap;}
#articleModalPanel .am-bullets{margin:18px 0;padding-left:20px;}
#articleModalPanel .am-bullets li{margin-bottom:6px;}
#articleModalPanel .am-tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0;}
#articleModalPanel .am-tag{font-family:var(--font-mono,monospace);font-size:11px;padding:3px 9px;border:1px solid var(--hair-strong);color:var(--ivory);}
#articleModalPanel .am-corrections{margin-top:24px;padding-top:18px;border-top:1px solid var(--hair);}
#articleModalPanel .am-correction{font-size:13px;margin-bottom:10px;padding:10px 12px;border-left:2px solid var(--gold-400);background:rgba(217,187,111,0.06);}
#articleModalPanel .am-correction .am-c-type{font-family:var(--font-mono,monospace);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ivory);}
#articleModalPanel .am-claims{margin-top:24px;padding-top:18px;border-top:1px solid var(--hair);}
#articleModalPanel .am-claims-empty p{opacity:.6;font-size:13px;margin-top:6px;}
#articleModalPanel .am-claim{margin-top:14px;padding:12px 14px;border-left:2px solid var(--hair-strong);background:rgba(255,255,255,0.02);}
#articleModalPanel .am-claim-conf{font-family:var(--font-mono,monospace);font-size:11px;opacity:.6;margin-left:8px;}
#articleModalPanel .am-claim-text{font-size:13.5px;margin:8px 0 0;line-height:1.5;}
#articleModalPanel .am-status{font-family:var(--font-mono,monospace);font-size:11px;opacity:.6;margin-bottom:14px;}
#articleModalClose{position:absolute;top:16px;right:18px;background:none;border:none;color:inherit;font-size:20px;cursor:pointer;opacity:.7;}
#articleModalClose:hover{opacity:1;}
.feed-clickable{cursor:pointer;}
.feed-clickable:hover h3, .feed-clickable:hover h4{color:var(--ivory);}

/* ---- drag: position tracking with sovereign emerald trail ---- */
.draggable{cursor:grab;touch-action:none;}
.draggable.dragging{
  cursor:grabbing;
  box-shadow:0 0 0 2px var(--gold-400), 0 12px 28px rgba(0,0,0,0.4);
  transition:box-shadow var(--dur-hover) var(--ease-out);
}
.drag-trail{
  position:absolute;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle, var(--focus-flash) 0%, transparent 70%);
  opacity:0;transition:opacity 400ms ease-out;
}

/* ---- swipe: sliding feedback with champagne gold edge (mobile drawer / carousels) ---- */
.swipeable{position:relative;}
.swipeable::before{
  content:'';position:absolute;top:0;bottom:0;width:3px;
  background:var(--gold-400);opacity:0;transition:opacity var(--dur-hover) var(--ease-out);
}
.swipeable.swipe-left::before{left:0;opacity:1;}
.swipeable.swipe-right::before{right:0;opacity:1;}

a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gold-400);outline-offset:3px;border-radius:1px;
}

/* ===== accessibility: skip link ===== */
.skip-link{
  position:absolute;top:-100px;left:12px;z-index:1000;
  background:var(--gold-400);color:var(--ink);
  font-family:var(--mono);font-size:12px;letter-spacing:0.04em;
  padding:12px 18px;border-radius:2px;transition:top .2s ease;
}
.skip-link:focus{top:12px;}

/* ===== accessibility: theme toggle ===== */
.theme-toggle{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;min-width:44px;
  background:transparent;border:1px solid var(--hair-strong);color:var(--ivory-dim);
  cursor:pointer;flex-shrink:0;transition:border-color .2s ease,color .2s ease;
}
.theme-toggle:hover{border-color:var(--ivory);color:var(--ivory);}
.theme-toggle svg{width:17px;height:17px;pointer-events:none;stroke:currentColor;fill:none;stroke-width:1.5;}
.theme-toggle .icon-moon{display:block;}
.theme-toggle .icon-sun{display:none;}
[data-theme="light"] .theme-toggle .icon-moon{display:none;}
[data-theme="light"] .theme-toggle .icon-sun{display:block;}

/* ===== accessibility: visually-hidden utility for screen readers ===== */
.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;
}

/* ===== accessibility: scalable text safety net (100%–200% zoom) ===== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{overflow-wrap:break-word;}
@media(min-width:1240px){
  html{font-size:clamp(16px,1vw + 10px,19px);}
}

/* ===== digital twins ===== */
.twins{background:var(--emerald-900);}
.twin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);}
.twin-card{background:var(--emerald-950);padding:30px 24px;display:flex;flex-direction:column;gap:16px;transition:background .3s ease;}
.twin-card:hover{background:var(--emerald-900);}
.twin-top{display:flex;justify-content:space-between;align-items:flex-start;}
.twin-top .kind{font-family:var(--mono);font-size:9.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ivory-dim);}
.twin-status{font-family:var(--mono);font-size:9.5px;letter-spacing:0.06em;text-transform:uppercase;padding:3px 8px;border-radius:2px;}
.twin-status.stable{color:#8fd6a8;background:rgba(143,214,168,0.12);}
.twin-status.elevated{color:var(--ivory-dim);background:rgba(217,187,111,0.12);}
.twin-status.watch{color:#e0a06b;background:rgba(224,160,107,0.12);}
.twin-card h4{font-family:var(--display);font-size:21px;font-weight:500;color:var(--ivory);}
.twin-row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;color:var(--ivory-dim);border-top:1px solid var(--hair);padding-top:10px;}
.twin-row b{color:var(--ivory-dim);font-weight:500;}
.twin-forecast{font-size:13px;line-height:1.55;color:var(--ivory-dim);}
.wse-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--hair-strong);margin-top:44px;border:1px solid var(--hair-strong);}
.wse-cell{background:var(--emerald-950);padding:16px 14px;}
.wse-cell .q{font-family:var(--mono);font-size:9.5px;color:var(--ivory-dim);letter-spacing:0.06em;text-transform:uppercase;}
.wse-cell .a{font-family:var(--body);font-size:12.5px;color:var(--ivory-dim);margin-top:8px;line-height:1.4;}

/* ===== developer portal ===== */
.dev-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;}
.dev-endpoints{border:1px solid var(--hair-strong);}
.dev-ep-row{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--hair);font-family:var(--mono);font-size:12.5px;}
.dev-ep-row:last-child{border-bottom:none;}
.dev-method{background:rgba(217,187,111,0.14);color:var(--ivory-dim);padding:2px 8px;font-size:10px;letter-spacing:0.05em;border-radius:2px;flex-shrink:0;}
.dev-path{color:var(--ivory);}
.dev-ep-desc{margin-left:auto;color:var(--ivory-dim);font-size:11px;text-align:right;}
.dev-tiers{display:flex;flex-direction:column;gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);}
.dev-tier{background:var(--emerald-950);padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:14px;}
.dev-tier .name{font-family:var(--display);font-size:15.5px;color:var(--ivory);}
.dev-tier .rate{font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);margin-top:3px;}
.dev-tier .price{font-family:var(--mono);font-size:14px;color:var(--ivory-dim);white-space:nowrap;}
.dev-sdks{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;}
.dev-sdk{font-family:var(--mono);font-size:10.5px;letter-spacing:0.06em;color:var(--ivory-dim);border:1px solid var(--hair-strong);padding:7px 12px;}

/* ===== pricing (Section 6) ===== */
.pricing-tabs{display:flex;gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);margin-bottom:40px;flex-wrap:wrap;}
.pricing-tab{
  flex:1;min-width:140px;background:var(--emerald-950);color:var(--ivory-dim);
  font-family:var(--mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;
  padding:16px 14px;border:none;cursor:pointer;text-align:center;min-height:44px;
}
.pricing-tab.active{background:var(--emerald-800);color:var(--ivory-dim);}
.pricing-tab:hover{color:var(--ivory-dim);}
.pricing-panel{display:none;}
.pricing-panel.active{display:block;}
.pricing-meta{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--hair);}
.pricing-meta div{flex:1;min-width:220px;}
.pricing-meta .k{font-family:var(--mono);font-size:9.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ivory-dim);}
.pricing-meta .v{font-family:var(--body);font-size:13.5px;color:var(--ivory-dim);margin-top:6px;line-height:1.5;}
.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);}
.price-grid.cols-5{grid-template-columns:repeat(5,1fr);}
.price-card{background:var(--emerald-950);padding:26px 20px;display:flex;flex-direction:column;gap:14px;}
.price-card.highlight{background:var(--emerald-800);}
.price-card .tier-name{font-family:var(--display);font-size:19px;font-weight:500;color:var(--ivory);}
.price-card .tier-price{font-family:var(--mono);font-size:22px;color:var(--ivory-dim);}
.price-card .tier-price sup{font-size:11px;color:var(--ivory-dim);font-weight:normal;}
.price-card .tier-annual{font-family:var(--mono);font-size:10.5px;color:var(--ivory-dim);}
.price-card ul{list-style:none;display:flex;flex-direction:column;gap:7px;margin-top:4px;border-top:1px solid var(--hair);padding-top:14px;}
.price-card li{font-family:var(--body);font-size:12.5px;color:var(--ivory-dim);line-height:1.4;display:flex;gap:8px;}
.price-card li::before{content:'—';color:var(--ivory);flex-shrink:0;}
.discount-tables{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);margin-top:44px;}
.discount-block{background:var(--emerald-950);padding:22px 24px;}
.discount-block h5{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:14px;}
.discount-table{width:100%;border-collapse:collapse;}
.discount-table th,.discount-table td{
  font-family:var(--mono);font-size:11px;color:var(--ivory-dim);text-align:left;
  padding:8px 6px;border-bottom:1px solid var(--hair);
}
.discount-table th{color:var(--ivory-dim);font-weight:500;letter-spacing:0.03em;}
.discount-table td:not(:first-child),.discount-table th:not(:first-child){text-align:right;}

@media(max-width:980px){
  .price-grid{grid-template-columns:repeat(2,1fr);}
  .price-grid.cols-5{grid-template-columns:repeat(2,1fr);}
  .discount-tables{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .price-grid,.price-grid.cols-5{grid-template-columns:1fr;}
}

/* ===== roadmap / implementation timeline (Section 7) ===== */
.roadmap-rail{position:relative;display:flex;flex-direction:column;gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);}
.roadmap-phase{
  background:var(--emerald-950);padding:22px 26px;
  display:grid;grid-template-columns:90px 1fr 1fr;gap:24px;align-items:center;
}
.roadmap-phase.current{background:var(--emerald-800);}
.roadmap-num{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);letter-spacing:0.08em;text-transform:uppercase;}
.roadmap-num .wk{display:block;margin-top:6px;color:var(--ivory-dim);font-size:9.5px;}
.roadmap-focus h4{font-family:var(--display);font-size:18px;font-weight:500;color:var(--ivory);}
.roadmap-deliv{font-family:var(--body);font-size:12.5px;color:var(--ivory-dim);line-height:1.5;}
.roadmap-progress{height:3px;background:var(--hair-strong);position:relative;margin-top:26px;overflow:hidden;}
.roadmap-progress-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--gold-500),var(--gold-300));width:0%;transition:width 900ms var(--ease-modal, ease-out);}
.priority-tables{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);margin-top:44px;}
.priority-block{background:var(--emerald-950);padding:22px 24px;}
.priority-block h5{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.priority-block .pw{font-size:9.5px;color:var(--ivory-dim);text-transform:none;letter-spacing:0.02em;}
.priority-table{width:100%;border-collapse:collapse;}
.priority-table th,.priority-table td{
  font-family:var(--mono);font-size:11px;color:var(--ivory-dim);text-align:left;
  padding:8px 6px;border-bottom:1px solid var(--hair);
}
.priority-table th{color:var(--ivory-dim);font-weight:500;letter-spacing:0.03em;}
.p-badge{
  display:inline-block;font-size:9.5px;letter-spacing:0.05em;padding:2px 7px;border-radius:2px;
  background:rgba(217,187,111,0.14);color:var(--ivory-dim);font-family:var(--mono);
}

@media(max-width:820px){
  .roadmap-phase{grid-template-columns:1fr;gap:8px;}
  .priority-tables{grid-template-columns:1fr;}
}

/* ===== newsletter ===== */
.newsletter{background:var(--emerald-900);}
.nl-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:60px;align-items:start;}
.nl-grid>.col-span-6{grid-column:span 6;}
.nl-tiers{display:flex;gap:1px;background:var(--hair-strong);border:1px solid var(--hair-strong);margin-bottom:24px;}
.nl-tier{flex:1;background:var(--emerald-950);padding:22px 20px;cursor:pointer;transition:background .2s ease;}
.nl-tier.active{background:var(--emerald-800);}
.nl-tier .name{font-family:var(--display);font-size:17px;color:var(--ivory);}
.nl-tier .price{font-family:var(--mono);font-size:12px;color:var(--ivory-dim);margin-top:4px;}
.nl-tier .freq{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);margin-top:8px;letter-spacing:0.04em;text-transform:uppercase;}
.nl-form{display:flex;gap:0;border:1px solid var(--hair-strong);}
.nl-form input{flex:1;background:var(--emerald-950);border:none;color:var(--ivory);font-family:var(--body);font-size:14px;padding:16px 18px;}
.nl-form input::placeholder{color:var(--ivory-dim);opacity:0.7;}
.nl-form input:focus{outline:none;}
.nl-form button{
  font-family:var(--mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ink);
  background:linear-gradient(180deg,var(--gold-300),var(--gold-500));padding:0 26px;border:none;cursor:pointer;
}
.nl-status{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);margin-top:12px;min-height:16px;}
.nl-features{border-top:1px solid var(--hair);padding-top:24px;}
.nl-features li{list-style:none;display:flex;gap:10px;font-family:var(--mono);font-size:12px;color:var(--ivory-dim);line-height:2;}
.nl-features li::before{content:'—';color:var(--ivory);}
.nl-unsub{font-family:var(--mono);font-size:10px;color:var(--ivory-dim);margin-top:18px;opacity:0.7;}

@media(max-width:980px){
  .twin-grid{grid-template-columns:repeat(2,1fr);}
  .wse-strip{grid-template-columns:repeat(2,1fr);}
  .dev-grid{grid-template-columns:1fr;gap:40px;}
  .nl-grid{grid-template-columns:1fr;gap:40px;}
}
@media(max-width:560px){
  .twin-grid{grid-template-columns:1fr;}
}

/* =======================================================
   SECTION 3: RESPONSIVE DESIGN WITH SOVEREIGN PRESENCE
   ======================================================= */

/* ---- 3.1 Mobile — hamburger trigger (hidden on tablet/desktop) ---- */
.nav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:44px;height:44px;
  min-width:44px;min-height:44px;
  background:transparent;
  border:1px solid var(--hair-strong);
  color:var(--ivory-dim);
  cursor:pointer;
  flex-shrink:0;
  transition:border-color .2s ease, background .2s ease, color .2s ease;
}
.nav-toggle:hover,
.nav-toggle[aria-expanded="true"]{border-color:var(--ivory);background:rgba(217,187,111,0.08);}
.nav-toggle:active{background:rgba(217,187,111,0.16);}
.nav-toggle svg{width:20px;height:20px;pointer-events:none;}
.nav-toggle .icon-close{display:none;}
.nav-toggle[aria-expanded="true"] .icon-open{display:none;}
.nav-toggle[aria-expanded="true"] .icon-close{display:block;}

/* ---- Mobile drawer navigation (one-handed reach: slides from right) ---- */
.mobile-drawer-backdrop{
  position:fixed;inset:0;background:rgba(4,36,28,0.7);z-index:290;
  opacity:0;visibility:hidden;transition:opacity .25s ease, visibility .25s;
}
.mobile-drawer-backdrop.open{opacity:1;visibility:visible;}
.mobile-drawer{
  position:fixed;top:0;right:0;bottom:0;
  width:min(84vw,360px);
  background:var(--emerald-900);
  border-left:1px solid var(--hair-strong);
  z-index:300;
  clip-path:inset(0 0 0 100%);
  transition:clip-path .3s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;
  overscroll-behavior:contain;
}
.mobile-drawer.open{clip-path:inset(0);}
.mobile-drawer-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;border-bottom:1px solid var(--hair-strong);flex-shrink:0;
}
.mobile-drawer-head span{
  font-family:var(--mono);font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ivory-dim);
}
.mobile-drawer-close{
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--hair-strong);color:var(--ivory-dim);cursor:pointer;
}
.mobile-drawer-close:hover{color:var(--ivory-dim);border-color:var(--ivory);}
.mobile-drawer-links{padding:10px 0;overflow-y:auto;flex:1;}
.mobile-drawer-links a{
  display:flex;align-items:center;min-height:44px;
  padding:12px 22px;
  font-family:var(--mono);font-size:12.5px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--ivory-dim);border-bottom:1px solid var(--hair);
  transition:color .2s ease, background .2s ease, border-color .2s ease;
}
.mobile-drawer-links a:active,
.mobile-drawer-links a.touch-active{color:var(--ivory-dim);background:rgba(217,187,111,0.08);border-color:var(--hair-strong);}
.mobile-drawer-foot{padding:18px 22px;border-top:1px solid var(--hair-strong);flex-shrink:0;}
.mobile-drawer-foot .cta{
  display:flex;align-items:center;justify-content:center;
  min-height:44px;width:100%;
}

/* ---- Bottom navigation (thumb-reach primary controls) ---- */
.bottom-nav{
  display:none;
  position:fixed;left:0;right:0;bottom:0;z-index:250;
  background:var(--emerald-900);
  border-top:1px solid var(--hair-strong);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));
  box-shadow:0 -10px 30px rgba(0,0,0,0.35);
}
.bottom-nav-row{display:flex;align-items:stretch;justify-content:space-between;}
.bottom-nav-item{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  min-height:48px;min-width:44px;
  background:transparent;border:none;color:var(--ivory-dim);cursor:pointer;
  font-family:var(--mono);font-size:8.5px;letter-spacing:0.06em;text-transform:uppercase;
  transition:color .2s ease;
  position:relative;
}
.bottom-nav-item svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6;}
.bottom-nav-item.active{color:var(--ivory-dim);}
.bottom-nav-item.active::before{
  content:'';position:absolute;top:-7px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--gold-400);
}
.bottom-nav-item:active{color:var(--ivory);}

/* Offline / reading-mode badge used on mobile */
.offline-badge{
  display:none;align-items:center;gap:6px;
  font-family:var(--mono);font-size:9px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--ivory-dim);background:rgba(217,187,111,0.1);border:1px solid var(--hair-strong);
  padding:5px 10px;
}
.offline-badge .dot-live{width:5px;height:5px;border-radius:50%;background:var(--gold-400);}

@media(max-width:980px){
  .nav-toggle{display:flex;}
  body{padding-bottom:64px;} /* clearance for bottom nav */
  .bottom-nav{display:block;}
  section:last-of-type{padding-bottom:100px;}
}

/* ---- 3.2 Tablet — split view + landscape optimization ---- */
@media(min-width:641px) and (max-width:1024px){
  body.tablet-split .page-shell{
    display:grid;
    grid-template-columns:220px 1fr;
  }
  .tablet-sidebar{
    display:none;
    border-right:1px solid var(--hair-strong);
    background:var(--emerald-900);
    padding:20px 0;
  }
  body.tablet-split .tablet-sidebar{display:block;position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto;}
  .tablet-sidebar a{
    display:flex;align-items:center;min-height:44px;padding:10px 20px;
    font-family:var(--mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;
    color:var(--ivory-dim);border-left:2px solid transparent;
  }
  .tablet-sidebar a:hover,.tablet-sidebar a.active{color:var(--ivory-dim);border-left-color:var(--ivory);background:rgba(217,187,111,0.06);}
  .nav-toggle,.mobile-drawer,.bottom-nav{ } /* tablet still uses drawer/bottom-nav by default; sidebar is opt-in */
}
@media(min-width:641px) and (max-width:1024px) and (orientation:landscape){
  .masthead{padding-top:14px;padding-bottom:14px;}
  .bottom-nav{padding-top:4px;padding-bottom:calc(4px + env(safe-area-inset-bottom));}
}

/* ---- 3.3 Desktop — command-center density, shortcuts, drag ---- */
@media(min-width:981px){
  .kbd-shortcut-hint{
    position:fixed;right:22px;bottom:22px;z-index:120;
    display:flex;align-items:center;gap:8px;
    font-family:var(--mono);font-size:10px;letter-spacing:0.05em;color:var(--ivory-dim);
    background:var(--emerald-900);border:1px solid var(--hair-strong);
    padding:9px 14px;opacity:0.85;transition:opacity .2s ease, border-color .2s ease;
  }
  .kbd-shortcut-hint:hover{opacity:1;border-color:var(--ivory);}
  .kbd-shortcut-hint kbd{
    border:1px solid var(--hair-strong);color:var(--ivory-dim);padding:1px 6px;border-radius:2px;font-family:var(--mono);
  }
  [draggable="true"].drag-enabled{cursor:grab;}
  [draggable="true"].drag-enabled:active{cursor:grabbing;}
  .drag-handle-dot{
    position:absolute;top:10px;right:10px;display:flex;gap:3px;opacity:0;transition:opacity .2s ease;
  }
  .twin-card{position:relative;}
  .twin-card:hover .drag-handle-dot{opacity:0.6;}
  .drag-handle-dot span{width:3px;height:3px;border-radius:50%;background:var(--gold-400);}
  .twin-card.dragging{opacity:0.35;border:1px dashed var(--gold-400);}
  .twin-card.drag-over{outline:1px solid var(--gold-400);outline-offset:-1px;}
}
@media(min-width:1440px){
  .twin-grid{grid-template-columns:repeat(4,1fr);} /* keep density high on large monitors */
}



.wt-section{padding:64px 40px;max-width:1100px;margin:0 auto;}
.wt-gate{max-width:var(--content-form);margin:24px auto 0;background:var(--emerald-900,#003D26);border:1px solid var(--hair-strong);border-radius:14px;padding:28px;}
.wt-gate p{color:var(--ivory-dim);font-size:13.5px;line-height:1.6;margin:0 0 18px;}
.wt-gate label{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ivory);margin-bottom:6px;}
.wt-gate input{width:100%;padding:9px 11px;margin-bottom:14px;background:var(--emerald-950);border:1px solid var(--hair-strong);border-radius:8px;color:var(--ivory);font-family:inherit;font-size:13.5px;box-sizing:border-box;}
.wt-gate button{width:100%;padding:10px;background:var(--gold-400);color:var(--emerald-950);border:none;border-radius:8px;font-weight:600;font-size:13.5px;cursor:pointer;}
.wt-gate .wt-msg{margin-top:12px;font-family:var(--mono);font-size:11.5px;}
.wt-gate .wt-msg.err{color:#e08a7a;}
.wt-gate .wt-msg.ok{color:#8fd6a8;}
.wt-app{display:none;}
.wt-cols{display:grid;grid-template-columns:280px 1fr;gap:20px;margin-top:20px;}
@media (max-width:820px){.wt-cols{grid-template-columns:1fr;}}
.wt-panel{border:1px solid var(--hair-strong);border-radius:12px;padding:16px;background:var(--emerald-900,#003D26);}
.wt-panel h4{font-family:var(--display);font-weight:500;font-size:14px;margin:0 0 12px;color:var(--ivory-dim);}
.wt-list{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px;}
.wt-list button.wt-wl-btn{width:100%;text-align:left;padding:8px 10px;background:transparent;border:1px solid var(--hair-strong);border-radius:8px;color:var(--ivory-dim);font-size:12.5px;cursor:pointer;display:flex;justify-content:space-between;}
.wt-list button.wt-wl-btn.active{border-color:var(--ivory);color:var(--ivory);}
.wt-list button.wt-wl-btn .n{font-family:var(--mono);opacity:.7;}
.wt-new-form{display:flex;gap:6px;}
.wt-new-form input{flex:1;padding:8px 9px;background:var(--emerald-950);border:1px solid var(--hair-strong);border-radius:6px;color:var(--ivory);font-size:12.5px;}
.wt-new-form button{padding:8px 12px;background:var(--gold-400);color:var(--emerald-950);border:none;border-radius:6px;font-weight:600;font-size:12px;cursor:pointer;}
.wt-item-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-top:1px solid var(--hair);font-size:12.5px;}
.wt-item-row:first-child{border-top:none;}
.wt-item-row button{background:none;border:none;color:#e08a7a;cursor:pointer;font-size:11px;}
.wt-search-row{display:flex;gap:6px;margin-top:10px;}
.wt-search-row input{flex:1;padding:8px 9px;background:var(--emerald-950);border:1px solid var(--hair-strong);border-radius:6px;color:var(--ivory);font-size:12.5px;}
.wt-search-results{margin-top:6px;display:flex;flex-direction:column;gap:4px;max-height:140px;overflow:auto;}
.wt-search-results button{text-align:left;padding:6px 8px;background:var(--emerald-950);border:1px solid var(--hair);border-radius:6px;color:var(--ivory-dim);font-size:12px;cursor:pointer;}
.wt-signal{border-top:1px solid var(--hair);padding:10px 0;font-size:12.5px;line-height:1.55;}
.wt-signal:first-child{border-top:none;}
.wt-signal .wt-tag{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:99px;border:1px solid var(--hair-strong);color:var(--ivory-dim);margin-right:6px;}
.wt-signal .wt-unverified{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:#e0b45a;}
.wt-signal.wt-live-new{animation:wtFlash 2s ease-out;}
@keyframes wtFlash{0%{background:rgba(0,143,90,0.14);}100%{background:transparent;}}
.wt-live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:var(--editorial-gray);}
.wt-live-dot.on{background:#008f5a;box-shadow:0 0 0 0 rgba(0,143,90,0.5);animation:wtPulse 2s infinite;}
@keyframes wtPulse{0%{box-shadow:0 0 0 0 rgba(0,143,90,0.4);}70%{box-shadow:0 0 0 6px rgba(0,143,90,0);}100%{box-shadow:0 0 0 0 rgba(0,143,90,0);}}
.wt-status-line{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);margin-bottom:8px;}
/* Milestone 112 — System State classification (Directive v12.0 §2.2's
   8-state model: LIVE/STALE/LOADING/EMPTY/ERROR/NOT_YET_LIVE/GATED/
   UNAUTHORIZED), ported as a plain labeling convention over this file's
   existing, already-correct live/degrade logic. This does NOT introduce any
   new fetch or change what any section actually shows — every status line
   already correctly distinguished these outcomes in prose; this just gives
   that distinction one consistent, honest visual vocabulary across all of
   them instead of each section inventing its own wording. */
.sys-state{display:inline-block;font-family:var(--mono);font-size:9px;letter-spacing:0.07em;text-transform:uppercase;padding:2px 7px;border-radius:2px;margin-right:6px;vertical-align:middle;}
.sys-state-live{background:rgba(143,214,168,0.14);color:#8fd6a8;border:1px solid rgba(143,214,168,0.35);}
.sys-state-stale{background:rgba(224,184,90,0.14);color:#e0b85a;border:1px solid rgba(224,184,90,0.32);}
.sys-state-loading{background:rgba(180,180,175,0.1);color:#b8b6ad;border:1px solid rgba(180,180,175,0.24);}
.sys-state-empty{background:rgba(180,180,175,0.08);color:#b8b6ad;border:1px solid rgba(180,180,175,0.2);}
.sys-state-error{background:rgba(217,110,110,0.14);color:#e08585;border:1px solid rgba(217,110,110,0.32);}
.sys-state-not_yet_live{background:transparent;color:var(--ivory-dim);border:1px dashed var(--hair-strong);opacity:0.8;}
.sys-state-gated{background:rgba(217,187,111,0.1);color:var(--ivory-dim);border:1px solid rgba(217,187,111,0.3);}
.sys-state-unauthorized{background:rgba(217,110,110,0.1);color:#e08585;border:1px dashed rgba(217,110,110,0.32);}
.wt-empty{font-size:12.5px;color:var(--ivory-dim);font-style:italic;}

/* Targeted public-page mobile repairs: preserve the source controls while preventing intrinsic min-content overflow. */
@media(max-width:640px){
  #factcheck .fc-header{align-items:stretch;min-width:0;}
  #factcheck .fc-metrics{width:100%;min-width:0;}
  #factcheck .fc-metric{min-width:0;flex:1;padding:12px 6px;}
  #factcheck .fc-metric .num{font-size:clamp(14px,4.2vw,20px);overflow-wrap:anywhere;}
  #newsletter .nl-form{width:100%;min-width:0;}
  #newsletter .nl-form input{width:0;min-width:0;flex:1 1 0;}
  #newsletter .nl-form button{flex:0 0 auto;padding-inline:10px;}
  #alerts .prefs-col,#alerts .history-col{padding:14px;min-width:0;}
  #alerts .quiet-hours{gap:6px;flex-wrap:wrap;}
  #alerts .quiet-hours input[type=time]{min-width:0;max-width:calc(50% - 8px);padding:8px 4px;}
}

/* Keep the directive navigation intact while tightening its desktop fit at the 1280px breakpoint. */
@media(min-width:981px) and (max-width:1320px){
  .masthead .brand{gap:10px;}
  .masthead .brand-text .name{font-size:17px;}
  .masthead .brand-text .sub{font-size:8px;letter-spacing:0.14em;}
  .masthead>div{gap:6px!important;}
  .masthead .nav{gap:8px!important;}
  .masthead .header-utilities .lang-trigger{padding:7px 7px;font-size:10px;letter-spacing:0.04em;}
}