:root { color-scheme:dark; --bg:#0d0f12; --panel:#15181d; --panel2:#1b1f25; --line:#2b313a; --text:#f2f3f5; --dim:#aeb5c0; --faint:#7f8895; --gold:#dda83f; --gold2:#f3c45e; --ok:#22c995; --bad:#f36b6b; --mono:"SFMono-Regular",Consolas,monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-height:100dvh; background:radial-gradient(circle at 82% 6%,rgba(221,168,63,.09),transparent 28%),var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
.skip { position:fixed; left:16px; top:-60px; z-index:20; padding:10px 14px; background:var(--gold); color:#221600; font-weight:700; }
.skip:focus { top:12px; }
.bar { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px clamp(20px,5vw,72px); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; font:750 12px/1 var(--mono); letter-spacing:.17em; }
.brand span { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:var(--gold); color:#211500; font-size:18px; letter-spacing:0; }
.back { color:var(--dim); font-size:13px; text-decoration:none; }
.back:hover { color:var(--text); }
main { width:min(1440px,100%); margin:auto; padding:0 clamp(20px,5vw,72px) 80px; }
.hero { min-height:620px; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(320px,.72fr); align-items:center; gap:clamp(42px,8vw,120px); padding:80px 0 100px; }
.eyebrow { margin:0 0 14px; color:var(--gold2); font:650 10px/1 var(--mono); letter-spacing:.17em; }
h1 { max-width:880px; margin:0; font-size:clamp(48px,7vw,94px); line-height:.94; letter-spacing:-.065em; text-wrap:balance; }
.lede { max-width:62ch; margin:28px 0 0; color:var(--dim); font-size:clamp(17px,2vw,21px); line-height:1.65; }
.recommended { position:relative; padding:32px; border:1px solid color-mix(in srgb,var(--gold) 45%,var(--line)); background:linear-gradient(150deg,rgba(221,168,63,.11),rgba(21,24,29,.96) 48%); box-shadow:0 30px 90px rgba(4,6,9,.42); }
.recommended::before { content:""; position:absolute; inset:7px; border:1px solid rgba(255,255,255,.035); pointer-events:none; }
.detected { display:inline-block; color:var(--ok); font:650 10px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.recommended h2 { margin:36px 0 12px; font-size:clamp(28px,4vw,46px); letter-spacing:-.045em; }
.recommended p { min-height:48px; margin:0 0 28px; color:var(--dim); line-height:1.55; }
.recommended small { display:block; margin-top:18px; color:var(--faint); line-height:1.5; }
.primary { display:inline-flex; min-height:48px; align-items:center; justify-content:center; padding:12px 18px; background:var(--gold); border:1px solid var(--gold); color:#201400; text-decoration:none; font-weight:780; transition:transform .12s ease,filter .2s ease; }
.primary:hover { filter:brightness(1.08); }.primary:active { transform:translateY(1px); }.primary.disabled { opacity:.48; pointer-events:none; }
.downloads { padding:84px 0; border-top:1px solid var(--line); }
.section-head { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(320px,1fr); gap:40px; align-items:end; margin-bottom:38px; }
.section-head h2,.boundary h2 { margin:0; font-size:clamp(32px,4vw,54px); letter-spacing:-.05em; }
.section-head>p { max-width:68ch; margin:0; color:var(--dim); line-height:1.65; }
.release-list { border-top:1px solid var(--line); }
.release { display:grid; grid-template-columns:70px minmax(180px,.7fr) minmax(240px,1fr) auto; gap:24px; align-items:center; min-height:126px; border-bottom:1px solid var(--line); }
.release .index { color:var(--faint); font:11px/1 var(--mono); }.release h3 { margin:0; font-size:26px; letter-spacing:-.035em; }.release p { margin:5px 0 0; color:var(--faint); }
.release .state { color:var(--dim); font:10px/1.4 var(--mono); text-transform:uppercase; letter-spacing:.1em; }.release .state.ready { color:var(--ok); }
.release a { padding:10px 14px; border:1px solid var(--line); text-decoration:none; font-size:13px; }.release a:hover { border-color:var(--gold); }
.loading { padding:44px 0; color:var(--faint); }
.boundary { display:grid; grid-template-columns:minmax(0,.9fr) minmax(320px,1fr); gap:64px; padding:78px 0; border-top:1px solid var(--line); }
.boundary ul { margin:0; padding:0; list-style:none; }.boundary li { padding:18px 0 18px 24px; border-bottom:1px solid var(--line); color:var(--dim); line-height:1.55; position:relative; }.boundary li::before { content:""; width:7px;height:7px;border-radius:50%;background:var(--ok);position:absolute;left:0;top:25px; }
code { font-family:var(--mono); color:var(--text); }
footer { display:flex; justify-content:space-between; gap:20px; padding:24px clamp(20px,5vw,72px); border-top:1px solid var(--line); color:var(--faint); font:11px/1.4 var(--mono); }
:where(a):focus-visible { outline:2px solid var(--gold2); outline-offset:4px; }
.bar-actions { display:flex; align-items:center; gap:18px; }
.language-picker select { padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--dim); font:12px/1 var(--mono); cursor:pointer; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

@media(max-width:820px){.hero,.section-head,.boundary{grid-template-columns:1fr}.hero{padding:64px 0;min-height:0}.release{grid-template-columns:38px 1fr;gap:12px;padding:22px 0}.release .state,.release .action{grid-column:2}.section-head{align-items:start}.bar{min-height:64px}.back{font-size:12px}.bar-actions{gap:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.primary{transition:none}}