@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@500&display=swap');

:root{
  --ink-900:#0A1626; --ink-800:#0F2034; --ink-700:#16304D;
  --apricot:#E8843C; --apricot-400:#F0A05E;
  --stone-50:#FAF8F5; --stone-100:#F2EEE8; --stone-200:#E6E0D6;
  --slate-900:#0B1220; --slate-700:#334155; --slate-500:#64748B; --muted:#9FB1C6;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:'Inter',system-ui,sans-serif;background:var(--stone-50);color:var(--slate-900);line-height:1.7}
a{color:var(--apricot);text-decoration:none}
a:hover{text-decoration:underline}

.topbar{position:sticky;top:0;z-index:10;background:rgba(10,22,38,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--ink-700)}
.topbar .wrap{max-width:880px;margin:0 auto;padding:0 24px;height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px;color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:20px}
.brand svg{width:34px;height:28px}
.back{color:var(--muted);font-size:14px;font-weight:500}
.back:hover{color:#fff;text-decoration:none}

.hero{background:var(--ink-900);color:#fff;padding:64px 24px 48px}
.hero .wrap{max-width:880px;margin:0 auto}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--apricot-400)}
.hero h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(32px,5vw,48px);font-weight:700;margin-top:12px;letter-spacing:-.01em}
.updated{color:var(--muted);font-size:14px;margin-top:14px}
.langtabs{display:inline-flex;gap:4px;margin-top:24px;background:var(--ink-800);border:1px solid var(--ink-700);border-radius:12px;padding:4px}
.langtabs button{cursor:pointer;border:0;background:transparent;color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:12px;text-transform:uppercase;padding:8px 14px;border-radius:8px;transition:.2s}
.langtabs button[aria-selected="true"]{background:var(--apricot);color:var(--ink-900)}

main{max-width:880px;margin:0 auto;padding:48px 24px 80px}
.note{background:var(--stone-100);border:1px solid var(--stone-200);border-left:3px solid var(--apricot);border-radius:12px;padding:16px 18px;font-size:14px;color:var(--slate-700);margin-bottom:40px}
section{margin-bottom:34px}
h2{font-family:'Space Grotesk',sans-serif;font-size:22px;font-weight:600;color:var(--slate-900);margin-bottom:10px;scroll-margin-top:90px}
h2 .num{color:var(--apricot);font-family:'JetBrains Mono',monospace;font-size:16px;margin-right:8px}
p,li{color:var(--slate-700);font-size:16px;margin-bottom:10px}
ul{padding-left:22px;margin-bottom:10px}
li{margin-bottom:6px}
strong{color:var(--slate-900)}
[data-lang]{display:none}
[data-lang].active{display:block}

footer{background:var(--ink-950,#060F1C);border-top:1px solid var(--ink-700);color:var(--muted);text-align:center;padding:28px 24px;font-size:14px}
footer a{color:var(--muted)}
