/* ==========================================================================
   Core design system (shared by every site). Per-site look = tokens.css only.
   No external requests. System font stack. Mobile-first. Auto dark mode.
   ========================================================================== */
:root{
  color-scheme:light dark;
  /* type */
  --font-sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --fs-xs:.78rem;--fs-sm:.875rem;--fs-md:1.0625rem;--fs-lg:1.2rem;--fs-xl:1.45rem;
  --fs-2xl:clamp(1.55rem,1.2rem + 1.4vw,2rem);
  --fs-3xl:clamp(1.9rem,1.3rem + 2.6vw,2.9rem);
  --fs-4xl:clamp(2.2rem,1.2rem + 4.6vw,3.7rem);
  --lh-tight:1.12;--lh-snug:1.3;--lh-body:1.7;
  --measure:68ch;
  /* spacing (4px base) */
  --s-1:.25rem;--s-2:.5rem;--s-3:.75rem;--s-4:1rem;--s-5:1.5rem;--s-6:2rem;--s-7:3rem;--s-8:4.5rem;--s-9:6rem;
  /* radius */
  --r-sm:8px;--r-md:12px;--r-lg:18px;--r-xl:28px;--r-pill:999px;
  /* layout */
  --wrap:72rem;--header-h:3.75rem;
  /* shadows (light) */
  --sh-1:0 1px 2px rgba(16,24,40,.06),0 1px 1px rgba(16,24,40,.04);
  --sh-2:0 4px 12px -2px rgba(16,24,40,.08),0 2px 4px -2px rgba(16,24,40,.06);
  --sh-3:0 18px 40px -12px rgba(16,24,40,.18),0 6px 12px -6px rgba(16,24,40,.08);
  /* semantic colours: neutral defaults, sites override in tokens.css */
  --bg:#f7f8fb;--surface:#fff;--surface-2:#f1f3f8;
  --ink:#141a2a;--ink-2:#2b3447;--mute:#5a6479;
  --line:#e2e6ee;--line-strong:#c9d0dd;
  --brand:#2748c9;--brand-ink:#1d37a0;--brand-soft:#eaeefc;--on-brand:#fff;
  --accent:#e8960b;--accent-soft:#fff3d9;
  --link:var(--brand-ink);
  --hero-1:var(--brand-soft);--hero-2:var(--surface);
  --info:#1d5fd0;--info-bg:#eaf2ff;
  --ok:#0b7a46;--ok-bg:#e5f6ec;
  --warn:#8a5200;--warn-bg:#fff4dc;
  --bad:#b4232a;--bad-bg:#fdebec;
  --unc:#7a3b9e;--unc-bg:#f5ecfb;
  --focus:var(--brand);
  --header-bg:color-mix(in srgb,var(--bg) 86%,transparent);
}
@media(prefers-color-scheme:dark){
  :root{
    --sh-1:0 1px 2px rgba(0,0,0,.4);
    --sh-2:0 6px 16px -4px rgba(0,0,0,.5);
    --sh-3:0 22px 44px -14px rgba(0,0,0,.7);
    --bg:#0e121b;--surface:#161b27;--surface-2:#1d2433;
    --ink:#eceff6;--ink-2:#d0d6e4;--mute:#9aa4b8;
    --line:#2a3345;--line-strong:#3b4660;
    --info:#7db0ff;--info-bg:#14233f;
    --ok:#5fd596;--ok-bg:#10281d;
    --warn:#f2c05e;--warn-bg:#2d2310;
    --bad:#ff8d92;--bad-bg:#31161a;
    --unc:#d3a5f2;--unc-bg:#25172f;
  }
}

/* ---------- reset / base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 1rem)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--fs-md)/var(--lh-body) var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh;display:flex;flex-direction:column}
main{flex:1;padding-block:var(--s-4) var(--s-7)}
img,svg{max-width:100%;height:auto}
[hidden]{display:none!important}
.wrap{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto}
::selection{background:var(--brand);color:var(--on-brand)}

/* ---------- typography ---------- */
h1,h2,h3,h4{font-weight:750;color:var(--ink);letter-spacing:-.022em;text-wrap:balance}
h1{font-size:var(--fs-3xl);line-height:var(--lh-tight);letter-spacing:-.035em;margin:.5rem 0 var(--s-4);font-weight:800}
h2{font-size:var(--fs-2xl);line-height:var(--lh-snug);margin:2.2em 0 .6em}
h3{font-size:var(--fs-lg);line-height:var(--lh-snug);margin:1.7em 0 .4em}
h4{font-size:var(--fs-md);margin:1.4em 0 .3em}
h2,h3{scroll-margin-top:calc(var(--header-h) + 1rem)}
p{margin:0 0 1.05em}
.lead{font-size:var(--fs-lg);line-height:1.55;color:var(--ink-2);max-width:var(--measure)}
.small{font-size:var(--fs-sm);color:var(--mute);line-height:1.55}
strong,b{font-weight:700}
a{color:var(--link);text-underline-offset:.18em;text-decoration-thickness:.08em;text-decoration-color:color-mix(in srgb,var(--link) 45%,transparent)}
a:hover{text-decoration-color:currentColor}
:where(ul,ol){padding-left:1.35em;margin:0 0 1.15em}
li{margin:.3em 0}li::marker{color:var(--brand);font-weight:700}
hr{border:0;border-top:1px solid var(--line);margin:var(--s-6) 0}
code,kbd{font-family:var(--font-mono);font-size:.88em;background:var(--surface-2);border:1px solid var(--line);padding:.08em .38em;border-radius:6px}
em{font-style:italic}
:where(main) :where(p,li,a,dd,td,.small){overflow-wrap:break-word}
:where(main) :where(p,ul,ol,dl,details,figure){max-width:var(--measure)}
:where(main) :where(.card,.tool,.stats,.cards,.hero,.tablewrap,.result,section) :where(p,ul,ol){max-width:none}
:where(.hero,.cards,.cmp,.stats,.tool,.card,form,.result,.articles) .lead{max-width:var(--measure)}

/* ---------- accessibility ---------- */
.skip{position:absolute;left:.75rem;top:-4rem;z-index:100;background:var(--brand);color:var(--on-brand);padding:.7rem 1rem;border-radius:var(--r-sm);font-weight:700;text-decoration:none;transition:top .15s}
.skip:focus{top:.75rem}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:1px;border-radius:var(--r-sm)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- top banner (disclaimer) ---------- */
.banner{background:var(--accent-soft);color:var(--ink-2);border-bottom:1px solid var(--line);font-size:var(--fs-sm);line-height:1.45;text-align:center;padding:.5rem 1rem}
.banner strong{color:var(--ink)}

/* ---------- header / nav ---------- */
header.site{position:sticky;top:0;z-index:50;background:var(--header-bg);backdrop-filter:saturate(1.5) blur(14px);-webkit-backdrop-filter:saturate(1.5) blur(14px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:var(--header-h);position:relative}
.logo{display:inline-flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.08rem;letter-spacing:-.025em;color:var(--ink);text-decoration:none;line-height:1.15}
.logo svg{width:2rem;height:2rem;flex:none;display:block}
.logo:hover{color:var(--brand-ink)}
.menu-btn{display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:var(--r-md);border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);cursor:pointer;padding:0}
.menu-btn:hover{background:var(--surface-2)}
.menu-btn svg{width:1.4rem;height:1.4rem}
header.site nav{display:none;position:absolute;top:calc(100% + 1px);left:calc(-1 * (100vw - 100%) / 2);right:calc(-1 * (100vw - 100%) / 2);flex-direction:column;gap:2px;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:var(--sh-3);padding:var(--s-3) max(1.25rem,calc((100vw - var(--wrap))/2)) var(--s-4)}
header.site nav.open{display:flex}
header.site nav a{display:block;padding:.8rem .9rem;border-radius:var(--r-md);color:var(--ink-2);font-weight:600;text-decoration:none}
header.site nav a:hover{background:var(--surface-2);color:var(--ink)}
header.site nav a[aria-current="page"]{background:var(--brand-soft);color:var(--brand-ink)}
@media(min-width:880px){
  .menu-btn{display:none}
  header.site nav,header.site nav.open{display:flex;position:static;flex-direction:row;gap:.25rem;background:none;border:0;box-shadow:none;padding:0;left:auto;right:auto}
  header.site nav a{padding:.5rem .85rem;font-size:.95rem}
}

/* ---------- buttons ---------- */
.btn,button.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;padding:.65rem 1.25rem;border-radius:var(--r-md);border:1px solid transparent;background:var(--brand);color:var(--on-brand);font:inherit;font-size:1rem;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:var(--sh-1),inset 0 1px 0 rgba(255,255,255,.18);transition:background .15s,transform .15s,box-shadow .15s}
.btn:hover{background:var(--brand-ink);color:var(--on-brand);box-shadow:var(--sh-2);transform:translateY(-1px)}
.btn:active{transform:none}
.btn.alt{background:var(--surface);color:var(--brand-ink);border-color:var(--line-strong);box-shadow:var(--sh-1)}
.btn.alt:hover{background:var(--brand-soft);border-color:var(--brand);color:var(--brand-ink)}
.btn.big{min-height:3.25rem;padding:.8rem 1.6rem;font-size:1.06rem;border-radius:14px}
.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
p:has(>.btn){display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;max-width:none}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;margin:var(--s-4) 0 var(--s-6);padding:var(--s-6) var(--s-5);border-radius:var(--r-xl);border:1px solid var(--line);background:radial-gradient(60rem 30rem at 100% 0,var(--hero-1),transparent 60%),linear-gradient(160deg,var(--hero-1),var(--hero-2) 78%);box-shadow:var(--sh-2);display:grid;gap:var(--s-5);grid-template-columns:minmax(0,1fr);align-items:center}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(color-mix(in srgb,var(--brand) 14%,transparent) 1px,transparent 1.4px);background-size:22px 22px;mask-image:linear-gradient(120deg,transparent 40%,#000);-webkit-mask-image:linear-gradient(120deg,transparent 40%,#000)}
.hero-copy>*:last-child{margin-bottom:0}
.hero h1{font-size:var(--fs-4xl);margin-top:.35rem;max-width:20ch;max-width:min(22ch,100%)}
.hero h1 em{font-style:normal;color:var(--brand-ink);background:linear-gradient(transparent 62%,color-mix(in srgb,var(--accent) 40%,transparent) 62%)}
.hero .lead{margin-bottom:var(--s-5)}
.hero .eyebrow{display:inline-block;margin:0 0 var(--s-2);padding:.28rem .8rem;border-radius:14px;background:var(--surface);border:1px solid var(--line);color:var(--brand-ink);font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;box-shadow:var(--sh-1)}
.hero p:has(>.btn){margin-bottom:var(--s-4);gap:var(--s-4)}
/* single CTA: secondary hero action becomes a text link */
.hero .btn.alt{background:none;border-color:transparent;box-shadow:none;min-height:0;padding:.4rem .2rem;color:var(--brand-ink);text-decoration:underline;text-decoration-thickness:.08em;text-underline-offset:.25em}
.hero .btn.alt:hover{background:none;transform:none;color:var(--ink);box-shadow:none}
.hero-art{display:none}
.hero-art svg{width:100%;height:auto;max-height:22rem;display:block;filter:drop-shadow(0 18px 24px color-mix(in srgb,var(--brand) 22%,transparent))}
@media(min-width:880px){
  .hero{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);padding:var(--s-8) var(--s-7);gap:var(--s-6)}
  .hero-art{display:block}
}
@media(min-width:420px){.hero{padding:var(--s-7) var(--s-6)}}

/* illustration palette (inline SVG, theme-aware) */
.i-b{fill:var(--brand)}.i-bs{fill:var(--brand-soft)}.i-a{fill:var(--accent)}.i-as{fill:var(--accent-soft)}
.i-s{fill:var(--surface)}.i-s2{fill:var(--surface-2)}.i-l{fill:var(--line-strong)}.i-ln{fill:var(--line)}.i-o{fill:var(--on-brand)}
.i-sb{stroke:var(--brand);fill:none}.i-sa{stroke:var(--accent);fill:none}.i-sl{stroke:var(--line-strong);fill:none}.i-so{stroke:var(--on-brand);fill:none}
.i-line{stroke-linecap:round;stroke-linejoin:round}

/* ---------- sections ---------- */
main>section{margin:var(--s-7) 0}
main>section>h2:first-child{margin-top:0}
main>.hero{margin-top:var(--s-4)}
.trust,.sources{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-3) var(--s-5) var(--s-4);box-shadow:var(--sh-1)}
.trust ul{list-style:none;padding:0;margin:0}
.trust li{position:relative;padding:.6rem 0 .6rem 2rem;margin:0;border-bottom:1px solid var(--line)}
.trust li:last-child{border-bottom:0}
.trust li::before{content:"";position:absolute;left:0;top:1rem;width:1.15rem;height:1.15rem;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.2 2.2 4.8-4.8' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100%}
.sources{background:var(--surface-2);box-shadow:none}
.sources ul{font-size:var(--fs-sm)}
.sources h2{font-size:var(--fs-xl);margin-top:.6em}

/* ---------- cards ---------- */
.cards{display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr);margin:var(--s-4) 0}
@media(min-width:640px){.cards,.cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:980px){.cards:not(.two){grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--sh-1);transition:transform .18s,box-shadow .18s,border-color .18s}
.card>:first-child{margin-top:0}.card>:last-child{margin-bottom:0}
.card h3{margin:0 0 .45em;font-size:1.12rem;line-height:1.3}
.card p{color:var(--ink-2);font-size:.97rem}
.cards .card:has(h3>a:only-child),.articles li{cursor:pointer}
.cards .card:has(h3>a:only-child):hover,.articles li:hover{transform:translateY(-3px);box-shadow:var(--sh-3);border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}
.card h3>a{color:var(--ink);text-decoration:none}
.card h3>a::after,.articles li>a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.card h3>a:focus-visible::after,.articles li>a:focus-visible::after{outline:3px solid var(--focus);outline-offset:2px}
.card h3>a:hover{color:var(--brand-ink)}
.card .meta,.articles .meta{display:flex;align-items:center;gap:.5rem;margin-top:var(--s-3);font-size:var(--fs-xs);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand-ink)}
.meta::before{content:"";width:.85rem;height:.85rem;background:currentColor;opacity:.8;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.2' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M8 4.6V8l2.3 1.4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.2' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M8 4.6V8l2.3 1.4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.meta::after{content:"→";margin-left:auto;font-size:1rem;transition:transform .18s}
.card:hover .meta::after,.articles li:hover .meta::after{transform:translateX(4px)}
.card .date{display:inline-block;background:var(--brand-soft);color:var(--brand-ink);border:1px solid color-mix(in srgb,var(--brand) 25%,transparent);border-radius:var(--r-pill);padding:.2rem .85rem;font-weight:700;font-size:var(--fs-sm);margin-bottom:var(--s-3)}
.tag{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--accent-soft);color:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-pill);padding:.12rem .6rem;vertical-align:middle}
.card.cta{background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand) 25%,var(--line))}
.card.aff{background:var(--surface-2);box-shadow:none;border-style:dashed;margin:var(--s-5) 0;max-width:var(--measure)}
.card.aff h3{font-size:1rem}
.related-block{margin:var(--s-6) 0}
/* comparison cards */
.cmp{display:grid;gap:var(--s-4);margin:var(--s-5) 0;grid-template-columns:minmax(0,1fr)}
@media(min-width:760px){.cmp{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cmp .card{display:flex;flex-direction:column;border-top:4px solid var(--brand)}
.cmp .card h2{font-size:var(--fs-xl);margin:.1em 0 .4em}
.cmp .card .btn{margin-top:auto}
.cmp dl{margin:.2em 0 1.2em}
.cmp dt{font-weight:700;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--mute);margin-top:1em}
.cmp dd{margin:.15em 0 0}
.chk.ok,.chk.todo,span.chk{display:inline-block;font-size:var(--fs-xs);border-radius:var(--r-pill);padding:.12rem .65rem;font-weight:700}
.chk.ok{background:var(--ok-bg);color:var(--ok)}.chk.todo{background:var(--warn-bg);color:var(--warn)}

/* index article list -> cards */
.articles{list-style:none;padding:0;margin:var(--s-5) 0;display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr);max-width:none!important}
@media(min-width:680px){.articles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.articles li{position:relative;margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--sh-1);transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;flex-direction:column}
.articles li>a{font-weight:750;font-size:1.1rem;line-height:1.3;letter-spacing:-.015em;color:var(--ink);text-decoration:none;margin-bottom:.4rem}
.articles li>a:hover{color:var(--brand-ink)}
.articles li .small{color:var(--ink-2);font-size:.94rem}
.articles li br{display:none}.articles li .small{display:block}
.articles .meta{margin-top:auto;padding-top:var(--s-3)}

/* ---------- callouts ---------- */
.note,.callout,.disclosure,blockquote,.unc,.warn,.ok,.bad{--tone:var(--info);--tone-bg:var(--info-bg)}
.note,.callout,.disclosure,blockquote,div.unc,p.unc,div.warn,p.warn,div.ok,p.ok,div.bad,p.bad,section.note{position:relative;margin:var(--s-5) 0;padding:var(--s-4) var(--s-4) var(--s-4) calc(var(--s-4) + 2.2rem);background:var(--tone-bg);border:1px solid color-mix(in srgb,var(--tone) 28%,transparent);border-left:4px solid var(--tone);border-radius:var(--r-md);color:var(--ink);font-size:.98rem;line-height:1.6}
.note::before,.callout::before,blockquote::before,div.unc::before,p.unc::before,div.warn::before,div.ok::before,div.bad::before,.disclosure::before{content:"i";position:absolute;left:var(--s-4);top:var(--s-4);width:1.35rem;height:1.35rem;border-radius:50%;background:var(--tone);color:var(--tone-bg);font:800 .8rem/1.35rem var(--font-sans);text-align:center;font-style:normal}
.note>:last-child,.callout>:last-child,blockquote>:last-child{margin-bottom:0}
.note p,.callout p,blockquote p,.disclosure p{margin:0 0 .6em;max-width:none}
.disclosure{--tone:var(--mute);--tone-bg:var(--surface-2);font-size:var(--fs-sm)}
.disclosure::before{content:"%"}
blockquote{margin-inline:0}
.note.ok,.ok.note,div.ok,p.ok,.callout.ok{--tone:var(--ok);--tone-bg:var(--ok-bg)}
.note.ok::before,div.ok::before{content:"✓"}
.note.bad,.warn,.callout.warn,.bad.note,div.bad{--tone:var(--bad);--tone-bg:var(--bad-bg)}
div.warn::before,div.bad::before,.note.bad::before,.callout.warn::before{content:"!"}
.note.warn,.callout.caution{--tone:var(--warn);--tone-bg:var(--warn-bg)}
.note.warn::before{content:"!"}
.unc{--tone:var(--unc);--tone-bg:var(--unc-bg)}
div.unc::before,p.unc::before{content:"?"}
div.unc>:first-child::before,p.unc::after{content:none}
span.unc{background:var(--unc-bg);color:var(--unc);padding:.1em .45em;border-radius:6px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
span.unc::before{content:"Uncertain: ";font-weight:800}
div.unc>:first-child::before{content:none}
/* in-table / list state colours */
li.ok,td.ok,span.ok,b.ok,strong.ok{color:var(--ok);background:none;border:0;padding:0}
li.warn,td.warn,span.warn{color:var(--warn);background:none;border:0;padding:0}
li.bad,td.bad,span.bad,.neg{color:var(--bad)}.pos{color:var(--ok)}
.res.note.ok,.res.note.bad{margin-top:var(--s-4)}

/* ---------- tables ---------- */
.tablewrap{position:relative;overflow-x:auto;margin:var(--s-5) 0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--sh-1);-webkit-overflow-scrolling:touch;max-width:100%;
  background:linear-gradient(to right,var(--surface) 30%,transparent) left/2rem 100% no-repeat local,linear-gradient(to left,var(--surface) 30%,transparent) right/2rem 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.2),transparent) left/.7rem 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.2),transparent) right/.7rem 100% no-repeat scroll,var(--surface)}
table{border-collapse:collapse;width:100%;font-size:.94rem;font-variant-numeric:tabular-nums}
.tablewrap table{min-width:24rem}
main>table,.art>table{margin:var(--s-5) 0;border:1px solid var(--line)}
th,td{padding:.7rem .9rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
thead th{background:var(--surface-2);color:var(--ink-2);font-size:var(--fs-xs);font-weight:750;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;position:sticky;top:0;border-bottom:2px solid var(--line-strong)}
tbody tr:nth-child(even){background:color-mix(in srgb,var(--surface-2) 70%,transparent)}
tbody tr:hover{background:var(--brand-soft)}
tbody tr:last-child td{border-bottom:0}
td.n,th.n{text-align:right}
tr.tot td{font-weight:800;background:var(--brand-soft);border-top:2px solid var(--line-strong)}
tr.miss td{background:var(--bad-bg)}tr.unk td{background:var(--warn-bg)}
tbody th{font-weight:700;background:none;text-transform:none;letter-spacing:0;font-size:inherit;color:var(--ink);position:static}
caption{caption-side:bottom;text-align:left;padding:.6rem .9rem;font-size:var(--fs-sm);color:var(--mute)}

/* ---------- forms & tools ---------- */
label{display:block;font-weight:650;font-size:var(--fs-sm);margin:0 0 .35rem;color:var(--ink)}
input:not([type=checkbox],[type=radio],[type=submit],[type=button]),select,textarea{display:block;width:100%;min-height:2.9rem;padding:.65rem .85rem;font:inherit;font-size:1rem;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:inset 0 1px 2px rgba(16,24,40,.05);transition:border-color .15s,box-shadow .15s}
textarea{min-height:9rem;font-family:var(--font-mono);font-size:.9rem;line-height:1.5;resize:vertical}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--mute) 75%,transparent)}
input:hover,select:hover,textarea:hover{border-color:var(--mute)}
input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 20%,transparent);outline:none}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}
select{appearance:none;-webkit-appearance:none;padding-right:2.4rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%238a93a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;background-size:1rem}
input[type=checkbox],input[type=radio]{width:1.15rem;height:1.15rem;margin:.2rem 0 0;accent-color:var(--brand);flex:none}
.tool,form.tool{position:relative;margin:var(--s-5) 0;padding:var(--s-5);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-2);overflow:hidden}
.tool::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--brand),var(--accent))}
div.tool{padding-top:calc(var(--s-5) + 4px)}
form.tool{padding-top:calc(var(--s-5) + 4px)}
.tool>:first-child{margin-top:0}.tool>:last-child{margin-bottom:0}
.tool h2{margin-top:0;font-size:var(--fs-xl)}
.tool h2:not(:first-child){margin-top:1.6em}
.tool p{max-width:none}
.row,.grid{display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr);margin-bottom:var(--s-4)}
@media(min-width:640px){.row,.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.row>div,.grid>div{min-width:0}
fieldset{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-3) var(--s-4) var(--s-4);margin:0 0 var(--s-4);min-width:0;background:color-mix(in srgb,var(--surface-2) 55%,transparent)}
legend{font-weight:750;font-size:var(--fs-sm);padding:0 .5rem;color:var(--ink)}
fieldset>label,label.chk{display:flex;gap:.7rem;align-items:flex-start;font-weight:500;font-size:.98rem;padding:.65rem .8rem;margin:.4rem 0 0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);cursor:pointer;transition:border-color .15s,background .15s}
fieldset>label:hover,label.chk:hover{border-color:var(--brand)}
fieldset>label:has(input:checked),label.chk:has(input:checked){border-color:var(--brand);background:var(--brand-soft)}
.chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem;margin:0}
@media(min-width:560px){.chips{grid-template-columns:repeat(6,minmax(0,1fr))}}
.chips label{display:flex;gap:.35rem;align-items:center;justify-content:center;margin:0;padding:.5rem .3rem;font-weight:600;font-size:var(--fs-sm);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);cursor:pointer}
.chips label:has(input:checked){background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.chips input{accent-color:var(--accent)}
.tool .btn+.btn{margin-left:0}
#cf-status,#s-err,[role=alert]:not(.note){color:var(--bad);font-weight:600;min-height:1.2em}
form#contact-form{display:grid;gap:var(--s-4);max-width:36rem}
form#contact-form p{margin:0}
/* result cards */
.result,#result,#resultat,#mtd-result,#s-out,#t-out,.res:not(.note){margin:var(--s-5) 0;padding:var(--s-5);background:linear-gradient(180deg,var(--brand-soft),var(--surface) 7rem);border:1px solid color-mix(in srgb,var(--brand) 28%,var(--line));border-radius:var(--r-lg);box-shadow:var(--sh-2)}
#result{background:none;border:0;box-shadow:none;padding:0}
#result>h2:first-child,.result>h2:first-child,.result>h3:first-child{margin-top:0}
.result ul,#mtd-result ul{padding-left:1.2em}
.stats{display:grid;gap:var(--s-3);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));margin:var(--s-4) 0;max-width:none!important}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-4);box-shadow:var(--sh-1);position:relative;overflow:hidden}
.stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--brand)}
.stat b{display:block;font-size:clamp(1.4rem,1rem + 1.6vw,1.9rem);line-height:1.15;color:var(--brand-ink);letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:.25rem;color:var(--mute);font-size:var(--fs-sm);line-height:1.35}
ul.checks{list-style:none;padding:0}
ul.checks li{position:relative;padding:.7rem 0 .7rem 2rem;margin:0;border-bottom:1px solid var(--line)}
ul.checks li::before{content:"";position:absolute;left:0;top:1rem;width:1.1rem;height:1.1rem;border:2px solid var(--brand);border-radius:5px}
.privacy{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--fs-sm);font-weight:650;color:var(--ok);background:var(--ok-bg);border-radius:var(--r-pill);padding:.3rem .9rem;margin:var(--s-2) 0}
.privacy::before{content:"🔒";font-size:.85em}

/* ---------- article layout + TOC ---------- */
.art{min-width:0}
.art>h1,main>h1{max-width:24ch;max-width:min(26ch,100%)}
.has-toc{display:block}
.toc{margin:var(--s-4) 0 var(--s-5);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-1);font-size:var(--fs-sm);max-width:none!important}
.toc summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;font-weight:750;font-size:var(--fs-sm);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.toc summary::-webkit-details-marker{display:none}
.toc summary::after{content:"";width:.6rem;height:.6rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .18s;margin-right:.2rem}
.toc[open] summary::after{transform:rotate(-135deg)}
.toc ol{list-style:none;margin:0;padding:0 1rem 1rem;max-height:60vh;overflow:auto;max-width:none}
.toc li{margin:0}
.toc li.l3{padding-left:.9rem}
.toc a{display:block;padding:.32rem .6rem;margin-left:-.6rem;border-left:2px solid transparent;color:var(--ink-2);text-decoration:none;line-height:1.4;border-radius:0 var(--r-sm) var(--r-sm) 0}
.toc li.l3 a{font-size:.84rem;color:var(--mute)}
.toc a:hover{background:var(--surface-2);color:var(--ink)}
.toc a.on{border-left-color:var(--brand);background:var(--brand-soft);color:var(--brand-ink);font-weight:650}
@media(min-width:1040px){
  .has-toc{display:grid;grid-template-columns:minmax(0,var(--measure)) 16.5rem;column-gap:var(--s-7);justify-content:center;align-items:start}
  .has-toc>*{grid-column:1;min-width:0}
  .has-toc>.toc{grid-column:2;grid-row:1 / span 200;position:sticky;top:calc(var(--header-h) + 1.25rem);margin:var(--s-2) 0 0;align-self:start;max-height:calc(100vh - var(--header-h) - 2.5rem);overflow:auto}
  .has-toc>*{max-width:none}
  .toc summary{pointer-events:none;cursor:default}
  .toc summary::after{display:none}
  .toc ol{max-height:none;overflow:visible}
}
/* article typography */
.art>p:first-of-type,.has-toc>p:first-of-type{}
.art h2,.has-toc h2{padding-top:.2em;margin-top:2em}
.art h2::before,.has-toc>h2::before{content:"";display:block;width:2.5rem;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--brand),var(--accent));margin-bottom:.6rem}
.art li,.has-toc li{color:var(--ink-2)}
.art p,.has-toc>p{color:var(--ink-2)}
.art p strong,.has-toc>p strong{color:var(--ink)}
.art>h1+p.small,.has-toc>h1+p.small{margin-top:-.4rem}
.art>p.small:first-child{margin-bottom:0}
.date,.meta-line{color:var(--mute)}

/* ---------- footer ---------- */
footer.site{margin-top:auto;border-top:1px solid var(--line);background:var(--surface);padding:var(--s-6) 0 var(--s-7);color:var(--mute);font-size:var(--fs-sm);line-height:1.6}
footer.site p{margin:.5em 0;max-width:62rem}
footer.site a{color:var(--ink-2)}
footer.site p:last-child{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:.4rem .9rem}
footer.site p:last-child a{text-decoration:none;font-weight:600}
footer.site p:last-child a:hover{text-decoration:underline}

/* ---------- print ---------- */
.hidden-print{}
@media print{header.site,footer.site,.banner,.hidden-print,.toc,.menu-btn,.skip,.hero-art{display:none!important}
  body{background:#fff;color:#000}.has-toc{display:block}.tool,.card,.tablewrap{box-shadow:none}}
.crumbs{font-size:var(--fs-sm);color:var(--mute);margin:var(--s-3) 0 0;overflow-wrap:anywhere}
.crumbs a{color:var(--ink-2)}