/* ==========================================================================
   SATARK / THE CASE FILE — design system summary  ({SITE_NAME} placeholder)
   --------------------------------------------------------------------------
   TOKENS   (all as custom properties on :root; light overrides on [data-theme="light"])
     Colour   --bg --surface --surface-2 --fg --fg-2 --line
              --accent #FFB000 (fill)   --accent-text (AA-safe amber text per theme)
              --red / --red-text  (alert, sparing)   --mint / --mint-text (verified, safe)
     Type     --f-display Instrument Serif · --f-mono IBM Plex Mono · --f-body Inter Tight
     Space    --s-1 .25rem … --s-8 6rem      Radius --r (2px, near-square, document feel)
   COMPONENTS (BEM)
     .site-header .alertbar .nav .search .theme-toggle   shell
     .hero .radar .checker                               signature: radar + guided checker
     .case (folder-tab card) .stamp .meter .redact       signature: case file, stamps, threat meter, redaction
     .btn .chip .tag .callout .toc .faq .wizard .check  UI
     .ad  labelled ad slot     .section .grid .split     layout
   SIGNATURE ELEMENTS
     1 Redaction bars   .redact → wipes on scroll / hover / tap / focus
     2 Stamps           .stamp--scam | --review | --safe | --verified
     3 Threat meter     .meter[data-level=1..5]
     4 Fraud Radar      #radar (generated by app.js, illustrative only)
     5 Checker          .checker (front-end routing only)
     6 Emergency strip  .alertbar (sticky)
     7 Case-file cards  .case
   ========================================================================== */
:root{
  --bg:#0A0E13;--surface:#121821;--surface-2:#1A2230;--fg:#F4F1EA;--fg-2:#A9B0BA;--line:#273041;
  --accent:#FFB000;--accent-ink:#0A0E13;--accent-text:#FFB000;
  --red:#E5484D;--red-text:#FF7B80;--mint:#2EE6A6;--mint-text:#2EE6A6;
  --f-display:"Instrument Serif",Georgia,serif;--f-mono:"IBM Plex Mono",ui-monospace,monospace;--f-body:"Inter Tight",system-ui,sans-serif;
  --s-1:.25rem;--s-2:.5rem;--s-3:1rem;--s-4:1.5rem;--s-5:2.5rem;--s-6:4rem;--s-7:5rem;--s-8:6rem;--r:2px;
  --wrap:min(1200px,100% - 2rem);--ease:cubic-bezier(.2,.7,.2,1);color-scheme:dark;
}
[data-theme="light"]{
  --bg:#F4F1EA;--surface:#FBF9F4;--surface-2:#EAE5DA;--fg:#0A0E13;--fg-2:#4A5260;--line:#CFC8B8;
  --accent-text:#7A4E00;--red-text:#B3262B;--mint-text:#0A6B4B;color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1.0625rem/1.6 var(--f-body);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--accent-text);text-underline-offset:3px}a:hover{color:var(--fg)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
h1,h2,h3{font-family:var(--f-display);font-weight:400;line-height:1.02;margin:0 0 var(--s-3);letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,7vw,5.2rem)}h2{font-size:clamp(2rem,4.5vw,3.2rem)}h3{font-size:1.6rem}
h4{font:600 1rem var(--f-body);margin:0 0 var(--s-2)}
p{margin:0 0 var(--s-3)}ul,ol{padding-left:1.2rem;margin:0 0 var(--s-3)}
.wrap{width:var(--wrap);margin-inline:auto}
.mono{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
.muted{color:var(--fg-2)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--accent-ink);padding:.6rem 1rem;z-index:100}.skip:focus{left:0}
.eyebrow{font:500 .75rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);display:flex;gap:.6rem;align-items:center;margin-bottom:var(--s-3)}
.eyebrow::before{content:"";width:1.6rem;height:2px;background:currentColor}

/* buttons / chips */
.btn{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.6rem 1.1rem;border:1.5px solid var(--fg);background:transparent;color:var(--fg);font:600 .95rem var(--f-body);text-decoration:none;border-radius:var(--r);cursor:pointer;transition:background .2s,color .2s,transform .2s var(--ease)}
.btn:hover{background:var(--fg);color:var(--bg)}
.btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn--primary:hover{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.btn--sm{min-height:36px;padding:.3rem .8rem;font-size:.85rem}
.chip{min-height:40px;padding:.3rem .9rem;border:1px solid var(--line);background:var(--surface);color:var(--fg);font:500 .78rem var(--f-mono);letter-spacing:.05em;text-transform:uppercase;border-radius:99px;cursor:pointer}
.chip:hover{border-color:var(--fg)}.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.tag{font:500 .7rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid currentColor;padding:.1rem .45rem;color:var(--fg-2);border-radius:var(--r);display:inline-block}
.tag--verify{color:var(--red-text)}

/* header + emergency strip */
.site-header{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--line)}
.alertbar{background:var(--accent);color:var(--accent-ink)}
.alertbar__in{display:flex;gap:.75rem;align-items:center;justify-content:space-between;min-height:44px;padding-block:.35rem}
.alertbar a{color:var(--accent-ink);font-weight:700;text-decoration:none;font-size:.92rem;line-height:1.25}
.alertbar a:hover{text-decoration:underline;color:var(--accent-ink)}
.alertbar__dot{width:.6rem;height:.6rem;border-radius:50%;background:var(--accent-ink);flex:none;animation:pulse 1.8s infinite}
.alertbar__l{display:flex;gap:.6rem;align-items:center}
.alertbar__r{font:600 .75rem var(--f-mono);white-space:nowrap}
.hdr{display:flex;align-items:center;gap:var(--s-3);min-height:64px}
.wordmark{font:400 1.9rem/1 var(--f-display);color:var(--fg);text-decoration:none;display:flex;align-items:baseline;gap:.35rem}
.wordmark:hover{color:var(--fg)}
.wordmark small{font:500 .6rem var(--f-mono);letter-spacing:.12em;color:var(--accent-text);text-transform:uppercase}
.nav{margin-left:auto;display:none;gap:.25rem}
.nav__a{padding:.5rem .7rem;color:var(--fg);text-decoration:none;font:500 .92rem var(--f-body);border-bottom:2px solid transparent}
.nav__a:hover,.nav__a[aria-current="page"]{border-color:var(--accent)}
.hdr__tools{margin-left:auto;display:flex;gap:.4rem;align-items:center}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;background:none;border:1px solid var(--line);color:var(--fg);cursor:pointer;border-radius:var(--r);font:600 .8rem var(--f-mono)}
.icon-btn:hover{border-color:var(--fg)}
.search{display:none;align-items:center;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.search input{background:none;border:0;color:var(--fg);font:400 .92rem var(--f-body);padding:.6rem .8rem;width:11rem;min-height:42px}
.search input:focus-visible{outline-offset:-2px}
.search button{border:0;background:none;color:var(--fg);padding:0 .7rem;cursor:pointer;font:600 .75rem var(--f-mono);min-height:42px}
.mnav{display:none;border-top:1px solid var(--line);padding:var(--s-3) 0}
.mnav.is-open{display:block}
.mnav a{display:block;padding:.7rem 0;color:var(--fg);text-decoration:none;font:400 1.5rem var(--f-display);border-bottom:1px solid var(--line)}
.mnav .search{display:flex;margin-bottom:var(--s-3)}.mnav .search input{width:100%}
@media(min-width:960px){.nav{display:flex}.hdr__tools{margin-left:0}.search{display:flex}.menu-btn{display:none}.mnav{display:none!important}}

/* sections */
.section{padding-block:var(--s-6);border-top:1px solid var(--line)}
.section--flush{border-top:0}.section--alt{background:var(--surface)}
.section__head{display:flex;flex-wrap:wrap;gap:var(--s-3);justify-content:space-between;align-items:flex-end;margin-bottom:var(--s-5)}
.section__head h2{margin:0;max-width:16ch}.section__head p{max-width:42ch;margin:0;color:var(--fg-2)}
.grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.split{display:grid;gap:var(--s-5)}
@media(min-width:900px){.split{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.split--even{grid-template-columns:1fr 1fr}}

/* hero */
.hero{padding-block:var(--s-5) var(--s-6);position:relative;overflow:hidden}
.hero__grid{display:grid;gap:var(--s-5);align-items:center}
@media(min-width:900px){.hero__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
.hero h1{margin-bottom:var(--s-4)}.hero__lede{max-width:46ch;color:var(--fg-2);font-size:1.15rem}
.radar{position:relative;aspect-ratio:1/1.05;max-width:520px;margin-inline:auto;width:100%;border:1px solid var(--line);background:radial-gradient(circle at 50% 50%,var(--surface-2),var(--bg) 70%)}
.radar svg{width:100%;height:100%}
.radar__dot{fill:var(--fg-2);opacity:.45}
.radar__ping{fill:var(--accent);transform-box:fill-box;transform-origin:center;animation:ping 3.2s var(--ease) infinite}
.radar__ring{fill:none;stroke:var(--accent);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:ring 3.2s var(--ease) infinite}
.radar__sweep{transform-origin:50% 50%;animation:spin 9s linear infinite;opacity:.5}
.radar__grid{stroke:var(--line);fill:none;stroke-width:1}
.radar__cap{position:absolute;left:.75rem;bottom:.6rem;right:.75rem;display:flex;justify-content:space-between;color:var(--fg-2)}
.radar__cap b{color:var(--accent-text);font-weight:500}
@keyframes ping{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}}
@keyframes ring{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(3.2)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{50%{opacity:.3}}

/* checker */
.checker{border:1.5px solid var(--fg);background:var(--surface);padding:var(--s-4);position:relative}
.checker__tab{position:absolute;top:-1.5px;left:-1.5px;transform:translateY(-100%);background:var(--fg);color:var(--bg);padding:.25rem .7rem}
.checker legend{font:400 clamp(2rem,5vw,3rem)/1 var(--f-display);padding:0;margin-bottom:var(--s-3)}
.checker fieldset{border:0;padding:0;margin:0}
.checker__opts{display:grid;gap:.5rem;grid-template-columns:1fr 1fr}
.opt{position:relative}.opt input{position:absolute;opacity:0;inset:0;cursor:pointer;width:100%;height:100%;margin:0}
.opt span{display:flex;gap:.5rem;align-items:center;min-height:56px;padding:.5rem .8rem;border:1px solid var(--line);background:var(--bg);font-weight:600;font-size:.95rem;line-height:1.2}
.opt span::before{content:attr(data-n);font:500 .7rem var(--f-mono);color:var(--accent-text)}
.opt input:checked+span{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--surface-2)}
.opt input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px}
.checker__out{margin-top:var(--s-3);padding:var(--s-3);border:1px dashed var(--fg-2);min-height:5.5rem}
.checker__note{margin:var(--s-3) 0 0;color:var(--fg-2);font-size:.85rem}

/* case file card */
.case{position:relative;margin-top:1.6rem;background:var(--surface);border:1px solid var(--line);padding:var(--s-4) var(--s-4) var(--s-3);display:flex;flex-direction:column;gap:var(--s-2);transition:transform .25s var(--ease),border-color .2s}
.case::before{content:attr(data-no);position:absolute;left:-1px;top:0;transform:translateY(-100%);background:var(--surface);border:1px solid var(--line);border-bottom:0;padding:.2rem .7rem;font:500 .7rem var(--f-mono);letter-spacing:.08em;color:var(--fg-2);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 100%,0 100%);padding-right:1.4rem}
.case:hover,.case:focus-within{transform:translateY(-4px);border-color:var(--accent)}
.case__title{font:400 1.7rem/1.08 var(--f-display);margin:0}
.case__title a{color:var(--fg);text-decoration:none}.case__title a::after{content:"";position:absolute;inset:0}
.case__meta{display:grid;grid-template-columns:auto 1fr;gap:.15rem .8rem;margin:var(--s-2) 0 0;font:400 .72rem var(--f-mono);letter-spacing:.04em;text-transform:uppercase;border-top:1px dashed var(--line);padding-top:var(--s-2)}
.case__meta dt{color:var(--fg-2)}.case__meta dd{margin:0}
.case p{color:var(--fg-2);font-size:.95rem;margin:0}
.case .stamp{position:absolute;right:1rem;top:1rem}
.case--feature{border-color:var(--fg)}.case--feature .case__title{font-size:clamp(2rem,4vw,3rem)}
.list-case{display:grid;gap:.4rem var(--s-3);padding:var(--s-3) 0;border-bottom:1px solid var(--line);position:relative}
@media(min-width:700px){.list-case{grid-template-columns:9rem 1fr auto;align-items:center}}
.list-case h3{margin:0;font-size:1.5rem}.list-case h3 a{color:var(--fg);text-decoration:none}.list-case h3 a::after{content:"";position:absolute;inset:0}
.list-case:hover h3 a{text-decoration:underline;text-decoration-color:var(--accent)}

/* stamps */
.stamp{display:inline-block;transform:rotate(-6deg);font:700 .68rem/1.1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;padding:.3rem .55rem;border:2px solid currentColor;border-radius:3px;box-shadow:inset 0 0 0 2px var(--bg),inset 0 0 0 3px currentColor;background:var(--bg);opacity:.95;pointer-events:none}
.stamp--scam{color:var(--red-text)}.stamp--review{color:var(--accent-text)}.stamp--safe,.stamp--verified{color:var(--mint-text)}
.stamp--lg{font-size:1rem;padding:.5rem .9rem;transform:rotate(-5deg)}
.stamp--in{animation:stampIn .5s var(--ease) both}
@keyframes stampIn{from{transform:rotate(-14deg) scale(1.8);opacity:0}}

/* threat meter */
.meter{display:inline-flex;align-items:center;gap:.6rem;font:500 .72rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.meter__bar{display:flex;gap:3px}.meter__bar i{width:14px;height:8px;background:var(--line);display:block}
.meter[data-level="1"] i:nth-child(-n+1),.meter[data-level="2"] i:nth-child(-n+2),.meter[data-level="3"] i:nth-child(-n+3),.meter[data-level="4"] i:nth-child(-n+4),.meter[data-level="5"] i:nth-child(-n+5){background:var(--accent)}
.meter[data-level="4"] i:nth-child(-n+4),.meter[data-level="5"] i:nth-child(-n+5){background:var(--red)}
.meter--lg .meter__bar i{width:28px;height:14px}

/* redaction */
.redact{position:relative;display:inline;cursor:pointer;background:linear-gradient(var(--fg),var(--fg)) no-repeat 0 55%/100% 1.05em;color:transparent;transition:color .1s .25s,background-size .5s var(--ease);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .12em;outline-offset:4px}
.redact.is-open,.redact:hover,.redact:focus-visible{background-size:0 1.05em;background-position:100% 55%;color:inherit}
.no-js .redact{background:none;color:inherit}
.redact--accent{background-image:linear-gradient(var(--accent),var(--accent))}
.case__title .redact{pointer-events:auto;position:relative;z-index:2}

/* alerts / callouts */
.callout{border:1px solid var(--line);border-left:6px solid var(--c,var(--accent));background:var(--surface);padding:var(--s-3) var(--s-4);margin:var(--s-4) 0}
.callout__k{font:600 .72rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--c-t,var(--accent-text));display:block;margin-bottom:.3rem}
.callout p:last-child{margin:0}
.callout--warn{--c:var(--red);--c-t:var(--red-text)}.callout--do{--c:var(--mint);--c-t:var(--mint-text)}.callout--src{--c:var(--fg-2);--c-t:var(--fg-2)}
.verify{font:600 .7rem var(--f-mono);color:var(--red-text);border:1px dashed currentColor;padding:.05rem .35rem;white-space:nowrap}

/* ad slots */
.ad{display:grid;place-items:center;min-height:120px;border:1px dashed var(--fg-2);color:var(--fg-2);font:500 .7rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;text-align:center;background:repeating-linear-gradient(135deg,transparent 0 10px,var(--surface) 10px 20px);margin-block:var(--s-4);contain:layout}
.ad--tall{min-height:250px}.ad--wide{min-height:90px}

/* quick paths / library tiles / stripes */
.paths{display:grid;gap:0;border:1px solid var(--fg);counter-reset:p}
.paths a{display:grid;grid-template-columns:3rem 1fr auto;gap:var(--s-3);align-items:center;padding:var(--s-3) var(--s-4);color:var(--fg);text-decoration:none;border-bottom:1px solid var(--line);counter-increment:p;transition:background .2s,padding .25s var(--ease)}
.paths a:last-child{border-bottom:0}
.paths a::before{content:counter(p,decimal-leading-zero);font:500 .8rem var(--f-mono);color:var(--accent-text)}
.paths a:hover{background:var(--accent);color:var(--accent-ink);padding-left:calc(var(--s-4) + .5rem)}
.paths a:hover::before{color:var(--accent-ink)}
.paths b{font:400 1.6rem/1.1 var(--f-display)}.paths span{color:inherit;opacity:.8;font-size:.9rem;display:block}
.tiles{display:grid;gap:0;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.tile{padding:var(--s-4);border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--fg);text-decoration:none;display:flex;flex-direction:column;gap:.4rem;min-height:150px;transition:background .2s}
.tile:hover{background:var(--surface-2)}.tile b{font:400 1.7rem/1.05 var(--f-display)}.tile .mono{color:var(--fg-2)}
.rights{display:grid;gap:var(--s-4)}
@media(min-width:800px){.rights{grid-template-columns:repeat(3,1fr)}}
.rights div{border-top:3px solid var(--accent);padding-top:var(--s-3)}
.rights h3{font-size:1.5rem}
.feature{display:grid;gap:var(--s-5);background:var(--fg);color:var(--bg);padding:var(--s-5)}
.feature a{color:var(--bg)}.feature .eyebrow{color:var(--bg)}
.feature .btn{border-color:var(--bg);color:var(--bg)}.feature .btn:hover{background:var(--bg);color:var(--fg)}
@media(min-width:900px){.feature{grid-template-columns:1.2fr 1fr;align-items:center}}
.ph{aspect-ratio:4/3;display:grid;place-items:center;text-align:center;padding:var(--s-3);border:1px dashed currentColor;font:500 .72rem var(--f-mono);letter-spacing:.1em;text-transform:uppercase;background:repeating-linear-gradient(135deg,transparent 0 9px,rgba(127,127,127,.18) 9px 10px)}

/* forms */
.field{display:grid;gap:.3rem;margin-bottom:var(--s-3)}
.field label{font:500 .75rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
input[type=text],input[type=email],input[type=search],input[type=date],select,textarea{width:100%;min-height:46px;padding:.6rem .8rem;background:var(--bg);color:var(--fg);border:1px solid var(--fg-2);border-radius:var(--r);font:400 1rem var(--f-body)}
textarea{min-height:120px;resize:vertical}
.nl{display:grid;gap:var(--s-4);padding:var(--s-5);border:1.5px solid var(--fg);background:var(--surface)}
@media(min-width:900px){.nl{grid-template-columns:1fr 1fr;align-items:center}}
.nl__row{display:flex;gap:.5rem;flex-wrap:wrap}.nl__row input{flex:1 1 220px}
.form-msg{margin-top:.6rem;font:500 .8rem var(--f-mono);color:var(--mint-text);min-height:1.2em}

/* trust bar */
.trust{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.trust div{padding-left:var(--s-3);border-left:1px solid var(--line)}.trust h3{font:600 1rem var(--f-body);margin-bottom:.3rem}
.trust p{color:var(--fg-2);font-size:.92rem;margin:0}

/* footer */
.footer{border-top:1px solid var(--fg);padding-block:var(--s-6) var(--s-4);margin-top:var(--s-6)}
.footer__grid{display:grid;gap:var(--s-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.footer h4{font:500 .72rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2)}
.footer ul{list-style:none;padding:0}.footer li{margin-bottom:.3rem}.footer a{color:var(--fg)}
.footer__legal{margin-top:var(--s-5);padding-top:var(--s-3);border-top:1px solid var(--line);color:var(--fg-2);font-size:.85rem}

/* page head + breadcrumbs */
.crumbs{font:500 .72rem var(--f-mono);letter-spacing:.06em;text-transform:uppercase;padding-block:var(--s-3);color:var(--fg-2)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:0}.crumbs li+li::before{content:"/";margin-right:.4rem}
.crumbs a{color:var(--fg-2)}.crumbs a:hover{color:var(--fg)}
.pagehead{padding-block:var(--s-4) var(--s-5)}.pagehead p{max-width:56ch;color:var(--fg-2);font-size:1.15rem}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:var(--s-3)}
.filters__lbl{font:500 .72rem var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2);width:100%;margin-top:var(--s-2)}
.empty{padding:var(--s-5);border:1px dashed var(--fg-2);text-align:center;color:var(--fg-2)}
.side{display:grid;gap:var(--s-4);align-content:start}
.side__box{border:1px solid var(--line);padding:var(--s-4);background:var(--surface)}
.side__box h3{font-size:1.5rem}.side__box ol{padding-left:1.4rem;margin:0}.side__box li{margin-bottom:.6rem}

/* article */
.art{display:grid;gap:var(--s-5)}
@media(min-width:1000px){.art{grid-template-columns:220px minmax(0,1fr);gap:var(--s-6)}.art--3{grid-template-columns:220px minmax(0,1fr) 280px}}
.toc{font-size:.92rem}.toc__in{position:sticky;top:130px}
.toc h2{font:500 .72rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2);margin-bottom:var(--s-2)}
.toc ol{list-style:none;padding:0;border-left:1px solid var(--line);margin:0}
.toc a{display:block;padding:.4rem 0 .4rem var(--s-3);color:var(--fg-2);text-decoration:none;margin-left:-1px;border-left:2px solid transparent}
.toc a:hover{color:var(--fg)}.toc a.is-active{color:var(--fg);border-color:var(--accent);font-weight:600}
@media(max-width:999px){.toc__in{position:static}.toc{border:1px solid var(--line);padding:var(--s-3);background:var(--surface)}}
.prose{max-width:68ch}.prose h2{font-size:clamp(1.9rem,4vw,2.6rem);margin-top:var(--s-6);scroll-margin-top:130px}
.prose h3{margin-top:var(--s-4)}
.prose>p:first-of-type{font-size:1.2rem}
.byline{display:flex;flex-wrap:wrap;gap:.4rem var(--s-4);padding-block:var(--s-3);border-block:1px solid var(--line);margin-block:var(--s-4)}
.takeaways{border:1.5px solid var(--fg);padding:var(--s-4);background:var(--surface);margin-block:var(--s-4)}
.takeaways h2{font:500 .75rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;margin-bottom:var(--s-2);color:var(--accent-text)}
.takeaways ul{margin:0}.takeaways li{margin-bottom:.4rem}
.step{display:grid;grid-template-columns:3.2rem 1fr;gap:var(--s-3);padding:var(--s-4) 0;border-top:1px solid var(--line)}
.step__n{font:400 3rem/1 var(--f-display);color:var(--accent-text)}.step h3{margin-top:0}
.faq details{border-bottom:1px solid var(--line);padding:var(--s-3) 0}
.faq summary{cursor:pointer;font:400 1.5rem/1.15 var(--f-display);list-style:none;display:flex;justify-content:space-between;gap:var(--s-3)}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";font:400 1.6rem/1 var(--f-mono);color:var(--accent-text)}
.faq details[open] summary::after{content:"–"}.faq details p{margin:var(--s-2) 0 0;color:var(--fg-2)}
.author{display:grid;grid-template-columns:72px 1fr;gap:var(--s-3);padding:var(--s-4);border:1px solid var(--line);background:var(--surface);margin-block:var(--s-5)}
.author .ph{aspect-ratio:1;font-size:.55rem;padding:.2rem}
.sources ol{font-size:.95rem;color:var(--fg-2)}
.share{display:grid;gap:var(--s-2);padding:var(--s-3);border:1px dashed var(--fg-2);background:var(--surface)}
.share__txt{font:400 .9rem/1.5 var(--f-mono);white-space:pre-wrap;margin:0}
.alert-head{display:grid;gap:var(--s-3);padding-block:var(--s-4) var(--s-4);position:relative}
.alert-head__row{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);align-items:center}
.alert-body h2{font-size:2.2rem;margin-top:var(--s-5)}

/* wizard / checklists */
.wizard__tabs{display:grid;grid-template-columns:repeat(3,1fr);border:1.5px solid var(--fg);margin-bottom:var(--s-4)}
.wizard__tab{padding:.8rem .5rem;min-height:64px;background:var(--bg);color:var(--fg);border:0;border-right:1px solid var(--fg);cursor:pointer;font:500 .72rem var(--f-mono);letter-spacing:.06em;text-transform:uppercase;text-align:left}
.wizard__tab:last-child{border-right:0}.wizard__tab b{display:block;font:400 1.5rem/1 var(--f-display);text-transform:none;letter-spacing:0;margin-top:.2rem}
.wizard__tab[aria-selected="true"]{background:var(--accent);color:var(--accent-ink)}
.wizard__bar{height:6px;background:var(--line);margin-bottom:var(--s-4)}.wizard__bar i{display:block;height:100%;width:0;background:var(--mint);transition:width .4s var(--ease)}
.wizard__panel[hidden]{display:none}
.check{display:grid;grid-template-columns:28px 1fr;gap:var(--s-3);padding:var(--s-3);border:1px solid var(--line);background:var(--surface);margin-bottom:.6rem;cursor:pointer}
.check input{width:24px;height:24px;accent-color:var(--accent);margin:2px 0 0}
.check:has(input:checked){border-color:var(--mint)}.check:has(input:checked) b{text-decoration:line-through;text-decoration-color:var(--mint);color:var(--fg-2)}
.check b{display:block;font-weight:600}.check span{color:var(--fg-2);font-size:.92rem;display:block}
.helpline{display:grid;gap:.3rem;border:1.5px solid var(--red);padding:var(--s-4);background:var(--surface);margin-bottom:var(--s-4)}
.helpline__n{font:400 clamp(3.5rem,12vw,6rem)/.9 var(--f-display);color:var(--red-text)}
.helpline__n a{color:inherit;text-decoration:none}
.letter{font:400 .9rem/1.6 var(--f-mono);min-height:260px}

/* library */
.az{display:flex;flex-wrap:wrap;gap:.3rem;margin-block:var(--s-3)}
.az button{width:40px;height:40px;border:1px solid var(--line);background:var(--surface);color:var(--fg);font:500 .8rem var(--f-mono);cursor:pointer}
.az button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.az button:disabled{opacity:.35;cursor:default}
.entry{display:grid;gap:.2rem var(--s-4);padding:var(--s-3) 0;border-bottom:1px solid var(--line);position:relative}
@media(min-width:700px){.entry{grid-template-columns:3rem 1fr 12rem;align-items:baseline}}
.entry__l{font:400 2.2rem/1 var(--f-display);color:var(--accent-text)}.entry h3{margin:0;font-size:1.6rem}.entry h3 a{color:var(--fg);text-decoration:none}.entry h3 a:hover{text-decoration:underline}
.entry p{margin:0;color:var(--fg-2);font-size:.95rem}
[hidden]{display:none!important}
.mt{margin-top:var(--s-5)}.checker{margin-top:var(--s-6)}.case--feature{margin-bottom:var(--s-4)}
.big404{font:400 clamp(8rem,30vw,18rem)/.8 var(--f-display)}

/* reveal */
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1;transform:none}
}
@media print{.site-header,.footer,.ad,.toc{display:none}}

/* ---- mobile / performance pass ---- */
.chip,.az button,.btn--sm{min-height:44px}.az button{width:44px;height:44px}
.footer li a{min-height:44px;display:inline-flex;align-items:center}
.crumbs a{min-height:44px;display:inline-flex;align-items:center}
.search button{min-width:44px}
.faq summary{min-height:44px}
.ph{contain:layout}
@media(max-width:699px){
  body{font-size:1rem}
  .grid,.tiles,.rights,.trust,.footer__grid,.checker__opts,.split,.split--even,.hero__grid,.feature,.nl,.art{grid-template-columns:minmax(0,1fr)}
  .alertbar__in{min-height:40px;padding-block:.15rem}.alertbar__r{display:none}.alertbar a{font-size:.85rem}
  .hdr{min-height:52px;gap:.5rem}.wordmark{font-size:1.6rem}.wordmark small{display:none}
  .icon-btn{width:44px;height:44px;font-size:.7rem}
  .site-header{position:sticky}
  .toc__in{position:static}
  .section{padding-block:var(--s-5)}
  .hero{padding-block:var(--s-4) var(--s-5)}
  .checker{padding:var(--s-3)}.opt span{min-height:56px}
  .feature,.nl{padding:var(--s-4)}
  .paths a{grid-template-columns:2rem 1fr auto;padding:var(--s-3)}.paths b{font-size:1.4rem}
  .wizard__tab{padding:.6rem .4rem;font-size:.62rem}.wizard__tab b{font-size:1.2rem}
  .step{grid-template-columns:2.4rem 1fr}.step__n{font-size:2.4rem}
  .author{grid-template-columns:56px 1fr}
  .case{padding:var(--s-3)}.case .stamp{position:static;align-self:flex-start;margin-bottom:.2rem}
  .list-case{grid-template-columns:minmax(0,1fr)}
  .entry{grid-template-columns:minmax(0,1fr)}.entry__l{display:none}
  .byline{flex-direction:column}
  .helpline__n{font-size:4rem}
}
@media(max-width:390px){h1{font-size:2.5rem}.redact{padding:0}.case__title{font-size:1.5rem}}

.alertbar a{display:flex;align-items:center;min-height:44px}
.alertbar__in{padding-block:0}
.wordmark{min-height:44px;align-items:center}
.crumbs a,.side__box li a,.toc a,.footer li a,.prose a,.tile{display:inline-flex;align-items:center;min-height:44px}
.crumbs li{display:flex;align-items:center}
.toc a{display:flex}
.prose p a,.prose li a,.callout a{display:inline;min-height:0;padding-block:.7rem;margin-block:-.7rem}
.list-case h3 a,.entry h3 a,.case__title a{display:inline-flex;align-items:center;min-height:44px}
.paths a{min-height:64px}
.side__box li{margin-bottom:0}
.tile{display:flex}
.alertbar__in{min-height:44px}
