:root{
  --bg:#EDF1F6; --fg:#0E141B; --muted:#56616F; --acc:#2E6E9E; --ice:#A9CBE6; --blue:#7BB4E0; --blue2:#5E9FD3; --on-blue:#0F1B2D;
  --line:rgba(14,20,27,.10); --soft:rgba(14,20,27,.04); --soft2:rgba(14,20,27,.07);
  --g1:rgba(255,255,255,.80); --g2:rgba(255,255,255,.45); --g3:rgba(124,196,255,.14); --gb:rgba(255,255,255,.95); --ring:rgba(14,20,27,.07); --bb:rgba(14,20,27,.12);
  --hi:rgba(255,255,255,1); --shade:0 24px 60px -30px rgba(30,60,120,.35); --spot:rgba(123,180,224,.10);
  --blob1:rgba(123,180,224,.20); --blob2:rgba(124,196,255,.35); --gridc:rgba(14,20,27,.035); --hdr:rgba(237,241,246,.78);
  --face1:rgba(255,255,255,.70); --face2:rgba(255,255,255,.30); --faceb:rgba(123,180,224,.38); --side:rgba(123,180,224,.28); --ftxt:#0E141B;
  --l0a:#FFFFFF; --l0b:#EEF3F9; --tagbg:rgba(255,255,255,.92); --h1a:#0E141B; --h1b:#2F6BFF;
  --display:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --body:"Golos Text",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --gut:max(16px, env(safe-area-inset-left, 0px)); --gutr:max(16px, env(safe-area-inset-right, 0px));
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0D1014; --fg:#EEF2F7; --muted:#9AA6B5; --acc:#A9CBE6; --line:rgba(255,255,255,.12); --soft:rgba(255,255,255,.04); --soft2:rgba(255,255,255,.12);
  --g1:rgba(255,255,255,.11); --g2:rgba(255,255,255,.035); --g3:rgba(124,196,255,.05); --gb:rgba(255,255,255,.16); --ring:rgba(0,0,0,0); --bb:rgba(255,255,255,.16);
  --hi:rgba(255,255,255,.28); --shade:0 24px 60px -34px rgba(0,0,0,.9); --spot:rgba(124,196,255,.12);
  --blob1:rgba(123,180,224,.28); --blob2:rgba(124,196,255,.14); --gridc:rgba(255,255,255,.025); --hdr:rgba(13,16,20,.8);
  --face1:rgba(170,210,255,.10); --face2:rgba(255,255,255,.02); --faceb:rgba(170,210,255,.32); --side:rgba(124,196,255,.30); --ftxt:#FFFFFF;
  --l0a:#18202A; --l0b:#10151C; --tagbg:rgba(20,26,34,.85); --h1a:#FFFFFF; --h1b:#B9D8FF; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0D1014; --fg:#EEF2F7; --muted:#9AA6B5; --acc:#A9CBE6; --line:rgba(255,255,255,.12); --soft:rgba(255,255,255,.04); --soft2:rgba(255,255,255,.12);
  --g1:rgba(255,255,255,.11); --g2:rgba(255,255,255,.035); --g3:rgba(124,196,255,.05); --gb:rgba(255,255,255,.16); --ring:rgba(0,0,0,0); --bb:rgba(255,255,255,.16);
  --hi:rgba(255,255,255,.28); --shade:0 24px 60px -34px rgba(0,0,0,.9); --spot:rgba(124,196,255,.12);
  --blob1:rgba(123,180,224,.28); --blob2:rgba(124,196,255,.14); --gridc:rgba(255,255,255,.025); --hdr:rgba(13,16,20,.8);
  --face1:rgba(170,210,255,.10); --face2:rgba(255,255,255,.02); --faceb:rgba(170,210,255,.32); --side:rgba(124,196,255,.30); --ftxt:#FFFFFF;
  --l0a:#18202A; --l0b:#10151C; --tagbg:rgba(20,26,34,.85); --h1a:#FFFFFF; --h1b:#B9D8FF; color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:16px;line-height:1.6;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(40vw 40vw at 85% 8%,var(--blob1),transparent 70%),radial-gradient(35vw 35vw at 5% 60%,var(--blob2),transparent 70%),
  linear-gradient(var(--gridc) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,var(--gridc) 1px,transparent 1px) 0 0/48px 48px,var(--bg)}
a{color:inherit}
p{margin:0}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:-.02em}
.wrap{padding-left:var(--gut);padding-right:var(--gutr);max-width:1180px;margin:0 auto}
.narrow{max-width:860px}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--acc)}
.muted{color:var(--muted)}
.glass{position:relative;border-radius:20px;background:linear-gradient(135deg,var(--g1),var(--g2) 55%,var(--g3));
  border:1px solid var(--gb);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
  box-shadow:inset 0 1px 0 var(--hi),0 0 0 1px var(--ring),var(--shade)}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,0%),var(--spot),transparent 60%)}
.glass:hover::after{opacity:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;font:600 15px/1.1 var(--display);text-decoration:none;cursor:pointer;color:var(--fg);border:1px solid var(--bb);
  background:linear-gradient(180deg,var(--g1),var(--g2));box-shadow:inset 0 1px 0 var(--hi);transition:transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn.cta{color:var(--on-blue);border-color:rgba(160,200,255,.55);background:linear-gradient(180deg,var(--blue),var(--blue2));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 30px -10px rgba(123,180,224,.8)}
.btn.sm{padding:9px 14px;font-size:13px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
header{position:sticky;top:0;z-index:9;padding-block:10px}
header .bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 16px;border-radius:999px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 15px var(--display)}
.logo i{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font:800 11px var(--display);font-style:normal;color:var(--on-blue);background:linear-gradient(135deg,#A9CBE6,#5E9FD3)}
.logo small{display:block;font:400 12px var(--body);color:var(--muted)}
.hright{display:flex;gap:8px;align-items:center}
.theme{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--bb);background:var(--soft);color:var(--fg);cursor:pointer;font-size:16px}
.crumbs{font-size:14px;color:var(--muted);margin:22px 0 10px}.crumbs a{color:var(--acc);text-decoration:none}
@media (max-width:560px){.logo small{display:none}.hright .btn{display:none}}
.phead{padding-block:clamp(20px,4vw,48px) clamp(24px,4vw,40px);display:grid;gap:16px}
.phead h1{font-size:clamp(32px,4.6vw,58px);line-height:1.05;font-weight:800}
.phead p{font-size:18px;color:var(--muted);max-width:60ch}
.meta{display:flex;flex-wrap:wrap;gap:8px}
.meta span{font:500 12px var(--mono);padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--soft);color:var(--muted)}
.card{padding:clamp(20px,3vw,32px)}
.stack{display:grid;gap:16px}
section{padding-bottom:clamp(40px,6vw,72px)}
.ctaband{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:clamp(20px,3vw,32px);border-radius:24px}
.ctaband b{display:block;font:800 clamp(20px,2.4vw,28px)/1.2 var(--display)}
.ctaband span{color:var(--muted)}
.ctaband .btns{display:flex;flex-wrap:wrap;gap:8px}
footer{padding:28px 0 40px;font-size:13px;color:var(--muted);border-top:1px solid var(--line)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}
footer a{color:var(--muted)}
.note{font-size:13px;color:var(--muted)}
.copy{font:600 12px var(--display);border:1px solid var(--bb);background:var(--soft);color:var(--fg);border-radius:999px;padding:6px 12px;cursor:pointer}
.copy.ok{background:var(--blue);color:var(--on-blue);border-color:var(--blue)}
.chk{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;padding:18px 20px;border-radius:16px;cursor:pointer}
.chk input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--blue)}
.chk b{display:block;font:700 17px/1.3 var(--display)}
.chk span{display:block;color:var(--muted);font-size:15px;margin-top:4px}
.score{position:sticky;bottom:12px;z-index:5;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-radius:18px;margin-top:16px}
.score b{font:800 20px var(--display)}
.meter{height:8px;border-radius:4px;background:var(--line);overflow:hidden;flex:1 1 160px}
.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--ice));transition:width .4s}
.rv{transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0)*60ms)}
.rv:not(.in){opacity:0;transform:translateY(20px)}
@media (prefers-reduced-motion:reduce){.rv{transition:none;opacity:1!important;transform:none!important}html{scroll-behavior:auto}}