/* Self-hosted JetBrains Mono (subset files from Google Fonts). */
/* These subsets are VARIABLE fonts (wght axis 400-800), so one face per subset
   covers the whole range: 400 body, 500 tags, 700 headings are all real instances
   of the axis. Verified in Chrome as pixel-identical to font-synthesis:none. */
/* cyrillic-ext */
/* MintGuardian — /next/ staging redesign.
   One font (JetBrains Mono). Palette = live site.css tokens only.
   No images except the two store badges. No shadows, no gradients for colour,
   radius ≤2px (exceptions: the score ring and the chain dots, which are circles). */

:root{
  --hero-delay:.2s;
  --bg-0:#07090b;--bg-1:#0a0c0e;--bg-2:#0e1217;--card:#11161d;
  --line-soft:rgba(255,255,255,.05);--line:rgba(255,255,255,.09);--line-hi:rgba(255,255,255,.16);
  /* --t-3 was #6e7681, which measured 4.09:1 on the card background and failed
     WCAG AA. Lifted to the nearest same-hue value clearing 4.5:1. --t-4 is left
     as it is: raising it to AA lands it on top of --t-3 and collapses two tiers
     of the type scale into one, which is a design change, not a contrast fix. */
  --t-1:#e6edf3;--t-2:#a8b2bd;--t-3:#78818c;--t-4:#4a525c;--t-5:#2f353d;
  --accent:#00ff88;--accent-dim:#00cc6a;--safe:#00ff88;--risky:#ffb86c;--danger:#ff5d5d;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --col:80ch;--pad:20px;--gap:56px;--shield-w:60vw;
}
*{box-sizing:border-box}
main{display:block}
/* No CJK face is bundled — the JetBrains Mono subsets are latin, latin-ext, cyrillic,
   greek and vietnamese. zh/ja/ko therefore fall back, and the stack below names the
   monospace CJK faces that actually exist rather than letting the browser guess.
   Latin runs inside these pages still get JetBrains Mono: it stays first. */
:lang(zh),:lang(ja),:lang(ko){
  --mono:'JetBrains Mono',ui-monospace,
         'Noto Sans Mono CJK SC','Noto Sans Mono CJK JP','Noto Sans Mono CJK KR',
         'Noto Sans CJK SC','Noto Sans CJK JP','Noto Sans CJK KR',
         'Hiragino Sans','Yu Gothic','Malgun Gothic','Microsoft YaHei','PingFang SC',
         'Droid Sans Fallback',monospace;
}
html{scroll-behavior:smooth;scroll-padding-top:64px;overflow-x:hidden;overflow-y:auto}
body{margin:0;background:var(--bg-0);color:var(--t-1);font-family:var(--mono);font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
/* CRT scanlines — ~2% and no more. Remove if it ever becomes visible. */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.02) 2px 3px)}
/* Character dot-grid texture (filled by site.js; pure text) */
.grid{position:fixed;inset:0;margin:0;z-index:0;pointer-events:none;user-select:none;overflow:hidden;color:var(--t-1);opacity:.03;font-size:14px;line-height:14px;white-space:pre}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
b,strong{font-weight:700;color:var(--t-1)}
h1,h2,h3{margin:0;font-weight:700;line-height:1.15;letter-spacing:-.01em}
h2{font-size:26px}
h3{font-size:16px}
p{margin:0}
.col{position:relative;z-index:1;max-width:var(--col);margin:0 auto;padding:0 var(--pad)}
.sec{padding-top:var(--gap)}
.pr{color:var(--accent)}
.dn{color:var(--danger)}

/* ── Glyph tags ─────────────────────────────────── */
.tag{display:inline-block;vertical-align:middle;font-size:10px;font-weight:500;letter-spacing:.14em;padding:1px 6px;border:1px solid;border-radius:2px;line-height:1.5}
.tag.live{color:var(--accent);border-color:var(--accent)}
.tag.beta{color:var(--risky);border-color:var(--risky)}
.tag.big{font-size:12px;padding:3px 9px}
.x{color:var(--danger)}
.ok{color:var(--accent)}

/* ── Prompt lines (section openers) ─────────────── */
.prompt{color:var(--t-3);font-size:15px;margin-bottom:22px;white-space:nowrap;overflow:hidden;text-overflow:clip}
.prompt .host{color:var(--accent)}
.prompt .cmd{color:var(--t-2)}
.prompt .cur{color:var(--accent);animation:blink 1.1s steps(1) infinite;margin-left:1px}
.prompt.typing .cur{animation:none}
@keyframes blink{50%{opacity:0}}


/* ── Preloader ─────────────────────────────── */
/* Hidden here and revealed by the inline block in templates/index.html, which
   runs before the first paint. That order is the whole design: with JS off the
   splash never appears at all rather than covering the page for good, and the
   worst case if a paint slips through early is the page's own black, not content
   that then gets covered. Landing only — /research and /answers have no .pre. */
.pre{display:none;position:fixed;inset:0;z-index:20;background:var(--bg-0);flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .5s ease}
html.has-pre .pre{display:flex}
.pre.out{opacity:0;pointer-events:none}
/* Same draw as the hero shield, shorter, and with no --d of its own: where
   @property is missing the mask goes invalid and the image simply shows, which
   is the right failure. Setting --d:0% there would mask it away entirely. */
.pre-shield{position:relative;width:min(44vw,180px);aspect-ratio:1;-webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent 100%);mask-image:radial-gradient(closest-side,#000 55%,transparent 100%)}
.pre-shield picture{display:block;width:100%;height:100%;-webkit-mask-image:linear-gradient(180deg,#000 calc(var(--d) - 12%),transparent var(--d));mask-image:linear-gradient(180deg,#000 calc(var(--d) - 12%),transparent var(--d));animation:shield-draw 1.2s cubic-bezier(.4,0,.2,1) both}
.pre-shield img{display:block;width:100%;height:100%;object-fit:cover}
.pre-edge{position:absolute;inset:0;background:radial-gradient(closest-side,transparent 58%,var(--bg-0) 100%)}
.pre-text{color:var(--t-3);font-size:13px}
.pre-text .host{color:var(--accent)}
.pre-text .cur{color:var(--accent);animation:blink 1.1s steps(1) infinite}
/* The hero's shield waits for the splash to clear before drawing itself. */
html.has-pre{--hero-delay:1.5s}
@supports not (background:paint(x)){.pre-shield picture{-webkit-mask-image:none;mask-image:none;animation:shield-in .8s ease-out both}}
/* Belt and braces: the inline block already declines to show it under reduced
   motion. Matching specificity, or html.has-pre .pre would win. */
@media (prefers-reduced-motion:reduce){html.has-pre .pre{display:none}}

/* ── Nav ────────────────────────────────────────── */
.nav{position:sticky;top:0;z-index:5;background:var(--bg-0);border-bottom:1px solid var(--line-soft)}
.nav-in{max-width:1040px;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"brand links cta";align-items:center;gap:8px 20px;padding-top:12px;padding-bottom:12px}
.brand{grid-area:brand;color:var(--t-1);font-weight:700;font-size:16px}
.brand:hover{text-decoration:none}
.brand .pr{margin-right:2px}
.nav-links{grid-area:links;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:0 8px;font-size:12.5px}
.nav-links a{color:var(--t-2)}
.nav-links a:hover{color:var(--t-1);text-decoration:none}
.nav-links li+li::before{content:'·';color:var(--t-4);margin-right:8px}
.burger-cb,.burger{display:none}
.cta-group{grid-area:cta;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.cta{display:inline-block;background:var(--accent);color:var(--bg-0);font-weight:700;font-size:13px;padding:8px 14px;border-radius:2px;white-space:nowrap}
.cta:hover{background:var(--accent-dim);text-decoration:none}
.cta:active{background:var(--accent-dim)}

/* ── Hero ───────────────────────────────────────── */
.hero{position:relative;padding-top:56px;padding-bottom:0;overflow:clip}
.hero-copy{position:relative;z-index:1}
/* Shield: PNG on dark teal → radial mask + matching site-bg radial on top hide the square. */
.shield{--sy:0px;--so:1;position:absolute;right:-8%;top:-24px;z-index:0;width:var(--shield-w);aspect-ratio:1;pointer-events:none;user-select:none;opacity:.35;transform:translateY(var(--sy));transform-origin:center;overflow:hidden;
  -webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent 100%);mask-image:radial-gradient(closest-side,#000 55%,transparent 100%)}
.shield picture{display:block;width:100%;height:100%;-webkit-mask-image:linear-gradient(180deg,#000 calc(var(--d) - 12%),transparent var(--d));mask-image:linear-gradient(180deg,#000 calc(var(--d) - 12%),transparent var(--d));animation:shield-draw 1.8s cubic-bezier(.4,0,.2,1) var(--hero-delay,.2s) both}
.shield-img{display:block;width:100%;height:100%;object-fit:cover}
.shield-edge{position:absolute;inset:0;background:radial-gradient(closest-side,transparent 58%,var(--bg-0) 100%)}
.shield-sweep{position:absolute;inset:-25%;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 78%,rgba(0,255,136,.16) 90%,rgba(230,237,243,.22) 94%,transparent 100%);-webkit-mask-image:radial-gradient(closest-side,transparent 60%,#000 66%,#000 74%,transparent 80%);mask-image:radial-gradient(closest-side,transparent 60%,#000 66%,#000 74%,transparent 80%);opacity:0;will-change:transform;animation:shield-ring-in .8s ease-out calc(var(--hero-delay,.2s) + 2s) both,shield-ring 6s linear calc(var(--hero-delay,.2s) + 2s) infinite}
@property --d{syntax:'<percentage>';inherits:false;initial-value:0%}
@keyframes shield-draw{from{--d:0%}to{--d:112%}}
@keyframes shield-ring-in{from{opacity:0}to{opacity:1}}
@keyframes shield-ring{from{transform:rotate(0)}to{transform:rotate(360deg)}}
/* Fallback where @property is unsupported (older Safari): show the image without the draw. */
@supports not (background:paint(x)){.shield picture{-webkit-mask-image:none;mask-image:none;animation:shield-in 1.2s ease-out both}}
@keyframes shield-in{from{opacity:0}to{opacity:1}}
.shield.off .shield-sweep{animation-play-state:paused}
.ver{color:var(--t-4);font-size:12px;letter-spacing:.08em}
h1{font-size:clamp(42px,9vw,68px);line-height:1;margin-top:10px;letter-spacing:-.03em}
.sub{margin-top:22px;max-width:56ch;color:var(--t-2);font-size:16px;line-height:1.7}
.log{position:relative;z-index:1;margin-top:44px}
.note{margin-top:18px;color:var(--t-3);font-size:14px}
.cta-row{position:relative;z-index:1;margin-top:36px;display:flex;align-items:center;gap:8px 24px;flex-wrap:wrap}
.badges{display:flex;flex-wrap:wrap;gap:8px 12px}
.badge{display:block;width:220px;height:85px;flex:none}
.badge img{display:block;width:220px;height:85px}
.link-btn{color:var(--t-2);font-size:14px;padding:12px 0}
.link-btn:hover{color:var(--t-1);text-decoration:none}
@media (min-width:1024px){
  .hero{display:grid;grid-template-columns:1fr 40%;grid-template-areas:"copy shield" "log log" "cta cta";column-gap:40px;align-items:center;overflow:visible}
  .hero-copy{grid-area:copy}
  .shield{position:relative;grid-area:shield;right:auto;top:auto;width:100%;opacity:var(--so);justify-self:end}
  .log{grid-area:log}.cta-row{grid-area:cta}
}
/* ── Observation log (ledger) ───────────────────── */
.ledger{border-top:1px solid var(--line-hi);border-bottom:1px solid var(--line-hi)}
.lh{display:grid;grid-template-columns:20ch 8ch 10ch 1fr;grid-template-areas:"time tk vd addr";gap:0 14px;padding:10px 0;color:var(--t-4);font-size:11px;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid var(--line-soft)}
.lh .addr-h{text-align:right}
.row{padding:18px 0;border-bottom:1px solid var(--line-soft);line-height:1.6}
.row:last-child{border-bottom:none}
.r1{display:grid;grid-template-columns:20ch 8ch 10ch 1fr;grid-template-areas:"time tk vd addr";gap:0 14px;align-items:baseline}
.r1 time{grid-area:time;color:var(--t-3);font-size:13px}
.r1 .tk{grid-area:tk;color:var(--t-1);font-weight:500}
.r1 .vd{grid-area:vd;font-weight:700;letter-spacing:.02em}
.r1 .vd b{font-weight:500;color:inherit;margin-left:6px}
.v-risky{color:var(--risky)}.v-danger{color:var(--danger)}.v-low{color:var(--safe)}
.r1 .addr{grid-area:addr;justify-self:end;text-align:right;background:none;border:0;padding:0;margin:0;font:inherit;font-size:13px;color:var(--t-2);cursor:pointer;word-break:break-all;min-height:44px;display:flex;align-items:center;justify-content:flex-end;gap:8px}
.addr .full,.addr .copied{display:none}
.addr.open .short{display:none}.addr.open .full{display:inline}
.addr.did .copied{display:inline;color:var(--accent);font-size:11px;letter-spacing:.1em}
.addr:hover .short,.addr:hover .full{color:var(--t-1)}
.r2{margin-top:6px;display:grid;grid-template-columns:calc(28ch + 14px) 1fr;grid-template-areas:"sig out";gap:0 14px}
.r2 .sig{grid-area:sig;color:var(--t-2)}
.r2 .out{grid-area:out;color:var(--t-2)}
.r2 .oc{color:var(--t-3);margin-right:8px}
.r2 .oc.ok{color:var(--accent)}
/* An outcome that links to its case log: underlined so it reads as a link, in the
   row's own colour so it does not shout across the table. */
.r2 .out a{color:var(--t-1);text-decoration:underline;text-decoration-color:var(--t-4);text-underline-offset:3px}
.r2 .out a:hover{color:var(--accent);text-decoration-color:var(--accent)}
.row.reveal{opacity:0;transition:opacity .6s ease}
.row.reveal.in{opacity:1}

/* ── Cards (verdict, gaps) — CSS-border frames ──── */
.card{border:1px solid var(--line-hi);background:var(--bg-2);padding:22px 24px}
.cprompt{color:var(--t-3);font-size:13px;margin-bottom:18px}
.cprompt .host{color:var(--accent)}
.mk{color:var(--t-4);font-size:10px;font-weight:500;letter-spacing:.06em;margin-left:8px;vertical-align:super;line-height:0}
.vtop{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pill{display:inline-block;border:1px solid var(--line-hi);border-radius:2px;padding:1px 8px;font-size:11px;letter-spacing:.14em;color:var(--t-2)}
.vaddr{color:var(--t-3);font-size:13px}
.vname{margin-top:10px;color:var(--t-2)}
.vlabel{margin-top:26px;color:var(--t-4);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.vline{margin-top:6px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.vverdict{font-size:30px;font-weight:700;color:var(--risky);letter-spacing:-.01em;line-height:1.1}
.vtag{display:inline-block;border:1px solid var(--risky);color:var(--risky);border-radius:2px;padding:1px 8px;font-size:11px;letter-spacing:.14em}
.vtagline{margin-top:10px;color:var(--t-2)}
.ringwrap{margin:30px auto 0;display:flex;flex-direction:column;align-items:center;gap:12px}
/* Score ring: conic-gradient arc on a hairline track; inner disc masks the centre. */
.ring{--p:0;position:relative;width:132px;height:132px;border-radius:50%;background:conic-gradient(var(--risky) calc(var(--p)*1%),var(--line) 0);display:flex;align-items:center;justify-content:center}
.ring::before{content:'';position:absolute;inset:9px;border-radius:50%;background:var(--bg-2)}
.ring .rn{position:relative;font-size:34px;font-weight:700;color:var(--t-1);line-height:1}
.ring .rn small{font-size:13px;font-weight:400;color:var(--t-3);margin-left:2px}
.rl{color:var(--t-4);font-size:11px;letter-spacing:.14em}
.vstats{margin:28px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;border-top:1px solid var(--line-soft);padding-top:18px}
.vstats div{margin:0}
.vstats dt{color:var(--t-4);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.vstats dd{margin:4px 0 0;color:var(--t-1);font-weight:500}
.vsum{margin-top:8px;color:var(--t-2);line-height:1.7}
.vsum .q{color:var(--t-4)}
.risk{margin-top:18px;border:1px solid var(--line);padding:14px 16px}
.rh{display:flex;align-items:flex-start;gap:10px;font-weight:500}
.rh .g,.rh .x{flex:none;white-space:nowrap}
.rh .sev{margin-left:auto;color:var(--danger);font-size:11px;letter-spacing:.14em}
.risk p{margin-top:8px;color:var(--t-2);font-size:14px;line-height:1.7}
.risk.cov{border-color:var(--line)}.risk.cov .rh{color:var(--t-2)}.risk.cov .g{color:var(--t-3)}.risk.cov p{color:var(--t-3)}.rh .sev.low{color:var(--t-3)}
.todo{color:var(--t-4)}

/* Verdict two-column at ≥1280 */
@media (min-width:1280px){
  :root{--col:1100px}
  .vgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:40px;align-items:start}
  .vgrid .annot{margin-top:0;position:sticky;top:80px;align-self:start;display:grid;grid-template-rows:auto auto auto auto;gap:22px}
  .vgrid .annot li{grid-column:1}
  /* Source order is now 01..04, so rows follow naturally; only the optical offsets remain. */
  .vgrid .annot li:nth-child(2){margin-top:20px}.vgrid .annot li:nth-child(3){margin-top:40px}.vgrid .annot li:nth-child(4){margin-top:0}
  /* Source order is card -> gap note -> principles -> annotations, so the note and
     the principles follow "Outside this scan" directly on narrow screens. Here the
     annotations are pinned back beside the card and those two drop below it. */
  .vgrid>.vcard{grid-column:1;grid-row:1}
  .vgrid>.annot{grid-column:2;grid-row:1}
  .vgrid>.note,.vgrid>.principles{grid-column:1}
}
/* Numbered callouts */
.annot{list-style:none;margin:28px 0 0;padding:0;counter-reset:a;display:flex;flex-direction:column;gap:14px}
.annot li{counter-increment:a;display:grid;grid-template-columns:3ch 1fr;gap:14px;color:var(--t-2);font-size:14px;line-height:1.7}
.annot li::before{content:counter(a,decimal-leading-zero);color:var(--t-4);font-size:12px;padding-top:3px;letter-spacing:.06em}
.annot li b{display:block;color:var(--t-1);font-weight:500;margin-bottom:2px}
.annot li>div{min-width:0}

/* Generic hairline lists (signals, features, chains) */
.sub-h{margin-top:40px;color:var(--t-4);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.hl{list-style:none;margin:10px 0 0;padding:0;border-top:1px solid var(--line-hi)}
.hl>li{padding:16px 0;border-bottom:1px solid var(--line-soft)}
.hl .h{display:flex;align-items:center;gap:10px;font-weight:500;color:var(--t-1)}
.hl .h .x{flex:none}
.hl p{margin-top:6px;color:var(--t-2);font-size:14px;line-height:1.7}
.keys{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;color:var(--t-3);font-size:14px}
.keys .x{margin-right:8px}

/* Coverage principles — plain text under the verdict card */
.lead{color:var(--t-2);font-size:16px;line-height:1.7;max-width:60ch}
.principles{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;color:var(--t-2);font-size:14px;line-height:1.7;max-width:60ch}
.principles li{display:grid;grid-template-columns:2ch 1fr;gap:10px}
.principles li::before{content:'—';color:var(--t-4)}

/* Language switcher — glyph row under the nav. Current language bracketed, the
   rest link to the sibling page. No redirect: the reader chooses. */
.langbar{border-bottom:1px solid var(--line-soft);background:var(--bg-0)}
.langs{list-style:none;margin:0;padding:7px 0;display:flex;flex-wrap:wrap;gap:0 2px;font-size:12px;letter-spacing:.06em}
.lg{display:inline-block;padding:3px 5px;color:var(--t-3);min-height:24px}
a.lg:hover{color:var(--t-1);text-decoration:none}
.lg.on{color:var(--accent)}

/* One dismissible line, EN only, shown by site.js when navigator.language names
   one of the other eight. Nothing is stored and nothing redirects. */
.langhint{border-bottom:1px solid var(--line-soft);background:var(--bg-1)}
.langhint .col{display:flex;align-items:center;gap:10px;padding-top:9px;padding-bottom:9px;color:var(--t-2);font-size:13px}
.lh-go{color:var(--accent)}
.lh-x{margin-left:auto;flex:none;background:none;border:0;padding:2px 6px;color:var(--t-3);font:inherit;font-size:16px;line-height:1;cursor:pointer}
.lh-x:hover{color:var(--t-1)}

/* The MEW card is a real app output shown as an artifact, so it stays English in
   every language. This caption says so. */
.card-cap{margin:12px 0 18px;color:var(--t-4);font-size:12px}

/* Chains */
.chains{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px;border-top:1px solid var(--line-hi)}
.chains li{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.cdot{width:8px;height:8px;border-radius:50%;flex:none}
.chains .st{margin-left:auto;color:var(--accent);font-size:10px;letter-spacing:.14em}
.h2gap{margin-top:12px}

/* Pricing */
.price{margin-top:22px;display:flex;flex-direction:column;gap:22px}
.price-note{color:var(--t-2);font-size:14px;line-height:1.7;max-width:60ch}

/* Footer */
.footer{margin-top:var(--gap);border-top:1px solid var(--line-soft);padding:44px 0 36px}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:28px}
.legal-note{margin-top:28px;color:var(--t-4);font-size:12px}
.footer .tag-line{margin-top:10px;color:var(--t-3);font-size:13px;max-width:28ch;line-height:1.6}
.footer h3{margin:0 0 10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-4);font-weight:500}
.footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.footer ul a{color:var(--t-2);font-size:13px}
.footer ul a:hover{color:var(--t-1);text-decoration:none}
.footer .fsoc{flex-direction:row;gap:16px;margin-top:16px}
.footer .fsoc a{display:inline-flex;line-height:0}
.footer .fsoc svg{display:block;width:20px;height:20px}
.fbot{margin-top:36px;padding-top:20px;border-top:1px solid var(--line-soft);display:flex;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;color:var(--t-4);font-size:12px}

/* ── Legal pages ────────────────────────────────── */
.legal{padding-top:48px}
.legal h1{font-size:clamp(28px,6vw,40px);margin-top:14px;letter-spacing:-.02em;line-height:1.1}
.legal-meta{margin-top:12px;display:flex;gap:14px;flex-wrap:wrap;color:var(--t-3);font-size:13px}
.legal .lead{margin-top:18px}
.toc{margin-top:28px;border:1px solid var(--line);padding:18px 20px}
.toc .lbl{color:var(--t-4);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.toc ol{margin:0;padding-left:20px;columns:2;column-gap:28px;font-size:13px}
.toc li{margin-bottom:6px}
.toc a{color:var(--t-2)}
.toc li::marker{color:var(--t-4)}
.ls{margin-top:40px}
.ls>h2{font-size:18px;display:flex;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line-soft)}
.ls>h2 .n{color:var(--accent);font-size:13px;font-weight:500}
.ls h3{margin-top:22px;font-size:15px}
.ls p,.ls li{color:var(--t-2);font-size:14px;line-height:1.75}
.ls p{margin:12px 0}
.ls ul,.ls ol{margin:12px 0;padding-left:22px}
.ls li{margin:6px 0}
.ls ul li::marker{color:var(--accent-dim)}
.ls code,.kbd{font-size:12.5px;color:var(--accent);border:1px solid var(--line);border-radius:2px;padding:0 5px}
.callout{border:1px solid var(--risky);padding:14px 16px;margin:16px 0}
.callout.danger{border-color:var(--danger)}
.callout .ct{color:var(--risky);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
.callout.danger .ct{color:var(--danger)}
.callout p{margin:0;color:var(--t-1)}
.def{width:100%;border-collapse:collapse;margin:14px 0}
.def td{border:1px solid var(--line);padding:10px 12px;font-size:13px;vertical-align:top;color:var(--t-3)}
.def td:first-child{color:var(--t-1);white-space:nowrap;width:1%}
/* delete-account */
.dev{color:var(--t-3);font-size:13px;margin-bottom:28px}
.lang-tag{display:inline-block;font-size:11px;letter-spacing:.14em;color:var(--t-3);border:1px solid var(--line);border-radius:2px;padding:1px 8px;margin-bottom:10px}
.steps{list-style:none;margin:12px 0;padding:0}
.steps li{padding:8px 0;border-bottom:1px solid var(--line-soft)}
.steps li:last-child{border-bottom:none}
.steps .n{color:var(--accent);margin-right:8px}
.panel{border:1px solid var(--line);padding:14px 18px;margin:14px 0}
.panel p{margin:0}
.panel .tight{margin-top:8px}
.del,.ls .del{color:var(--danger)}
.keep,.ls .keep{color:var(--risky)}
.muted,.ls .muted{color:var(--t-3)}
hr{border:0;border-top:1px solid var(--line);margin:44px 0}
.dfoot{margin-top:48px;color:var(--t-4);font-size:12px}

/* ── Reduced motion: everything static ──────────── */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .prompt .cur{animation:none}
  .row.reveal{opacity:1;transition:none}
  .shield{transform:none!important;opacity:.35}
  .shield picture{animation:none;-webkit-mask-image:none;mask-image:none}
  .shield-sweep{display:none}
  @media (min-width:1024px){.shield{opacity:1}}
}

/* ── Responsive ─────────────────────────────────── */
@media (max-width:1023px){
  .shield{width:min(60vw,420px);right:-6%;top:-10px;opacity:.3}
  .hero-copy{max-width:60ch}
}
@media (max-width:860px){
  .nav-in{grid-template-columns:1fr auto;grid-template-areas:"brand cta" "links links";gap:8px 12px}
  .nav-links{justify-content:flex-start}
  .lh,.r1{grid-template-columns:18ch 8ch 9ch 1fr;gap:0 12px}
  .r2{grid-template-columns:1fr;grid-template-areas:"sig" "out";gap:4px}
}
@media (max-width:760px){
  .fgrid{grid-template-columns:1fr 1fr}
  .fgrid>div:first-child{grid-column:1/-1}
  .chains{grid-template-columns:1fr 1fr}
  .vstats{grid-template-columns:1fr 1fr 1fr;gap:12px}
}
@media (max-width:600px){
  :root{--pad:18px;--gap:48px}
  body{font-size:14.5px}
  h2{font-size:22px}
  /* Mobile menu: compact sticky bar, then a full-screen terminal list.
     Driven by the .burger-cb checkbox rather than a class site.js toggles, so it
     works on /research and /answers, which carry no script, and with JS off.
     The two :has() rules are the only part that needs it; without :has() the menu
     still opens and the page behind it simply keeps scrolling. */
  .nav-in{grid-template-columns:1fr auto;grid-template-areas:"brand burger" "links links" "cta cta";gap:0 12px;padding-top:10px;padding-bottom:10px}
  .burger-cb{display:block;position:absolute;width:1px;height:1px;margin:0;padding:0;border:0;overflow:hidden;clip-path:inset(50%)}
  .burger{grid-area:burger;display:grid;align-content:center;gap:5px;width:44px;height:44px;margin:-8px -10px -8px 0;padding:0 10px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .burger span{display:block;height:2px;width:22px;background:var(--t-1);transform-origin:center;transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .25s,width .4s cubic-bezier(.4,0,.2,1)}
  .burger span:nth-child(2){width:14px;background:var(--accent)}
  .burger-cb:checked~.burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger-cb:checked~.burger span:nth-child(2){opacity:0;width:0}
  .burger-cb:checked~.burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  /* The checkbox is the focusable control and it is invisible, so the ring goes
     on the label it drives. */
  .burger-cb:focus-visible~.burger{outline:2px solid var(--accent);outline-offset:2px}
  .nav-links,.cta-group{display:grid;overflow:hidden;max-height:0;opacity:0;transition:max-height .5s cubic-bezier(.4,0,.2,1),opacity .3s,padding .5s cubic-bezier(.4,0,.2,1)}
  /* 480px is eight 48px rows plus the padding, with room for a label that wraps.
     max-height only caps the box, so the headroom costs nothing but a little
     dead time at the end of the transition. */
  .burger-cb:checked~.nav-links{max-height:480px;opacity:1;padding-top:22px}
  .burger-cb:checked~.cta-group{max-height:120px;opacity:1;padding:20px 0 14px}
  .nav-links{gap:0;font-size:18px}
  .nav-links li{border-top:1px solid var(--line-soft);transform:translateX(-14px);opacity:0;transition:transform .45s cubic-bezier(.4,0,.2,1),opacity .35s}
  .nav-links li+li::before{content:none}
  .burger-cb:checked~.nav-links li{transform:none;opacity:1}
  .burger-cb:checked~.nav-links li:nth-child(1){transition-delay:.08s}.burger-cb:checked~.nav-links li:nth-child(2){transition-delay:.13s}.burger-cb:checked~.nav-links li:nth-child(3){transition-delay:.18s}.burger-cb:checked~.nav-links li:nth-child(4){transition-delay:.23s}.burger-cb:checked~.nav-links li:nth-child(5){transition-delay:.28s}.burger-cb:checked~.nav-links li:nth-child(6){transition-delay:.33s}.burger-cb:checked~.nav-links li:nth-child(7){transition-delay:.38s}.burger-cb:checked~.nav-links li:nth-child(8){transition-delay:.43s}
  .nav-links a{display:flex;align-items:center;gap:12px;min-height:48px;color:var(--t-1)}
  .nav-links a::before{content:'>';color:var(--accent);font-weight:700}
  .nav-links a::after{content:'';flex:1;text-align:right;color:var(--t-4);font-size:11px;letter-spacing:.06em}
  .nav-links li:last-child{border-bottom:1px solid var(--line-soft)}
  .nav-links li:last-child a::after{content:'▮';animation:blink 1s steps(1) infinite}
  .cta-group{grid-template-columns:1fr 1fr;gap:8px}
  .cta{text-align:center;padding:12px 10px;font-size:12px}
  .nav:has(.burger-cb:checked){min-height:100dvh}
  /* html, not body: html already owns the viewport's overflow here, so a rule on
     body would not lock the scroll behind the menu. */
  html:has(.burger-cb:checked){overflow:hidden}
  @media (prefers-reduced-motion:reduce){.nav-links,.cta-group,.nav-links li,.burger span{transition:none}}
  .hero{padding-top:40px}
  .shield{width:64vw;right:-4%;top:-16px}
  .sub{font-size:15px}
  .prompt{font-size:14px}
  .lh{display:none}
  .r1{grid-template-columns:1fr auto;grid-template-areas:"time addr" "tk vd";gap:2px 12px}
  .r1 time{font-size:12px}
  .r1 .addr{font-size:12px}
  .r1 .vd{justify-self:start}
  .r1 .addr{min-height:0;padding:0}
  .r2{grid-template-columns:1fr;grid-template-areas:"sig" "out";gap:4px}
  .card{padding:18px 16px}
  .vverdict{font-size:26px}
  .vstats{grid-template-columns:1fr 1fr;gap:14px 10px}
  .vstats dt{font-size:10px}
  .ring{width:112px;height:112px}.ring .rn{font-size:28px}
  .risk{padding:12px 12px}
  .rh{flex-wrap:wrap}.rh .sev{margin-left:0;flex-basis:100%;padding-left:calc(1ch + 10px)}
  .badges{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  .badge,.badge img{width:100%;height:auto}
  .cta-row .link-btn{flex-basis:100%}
  h1{font-size:clamp(40px,12vw,52px)}
  .chains{grid-template-columns:1fr}
  .toc ol{columns:1}
  .def td:first-child{white-space:normal}
  .fbot{flex-direction:column}
}
