:root { color-scheme: dark; --bg:#0e1210; --surface:#181e1a; --raised:#212922; --line:#344036; --text:#f3efe6; --muted:#a3ada4; --green:#89b897; --gold:#d9ae72; font-family:"Segoe UI",system-ui,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; }
body { margin:0; min-width:320px; background:var(--bg); color:var(--text); line-height:1.6; }
a { color:inherit; text-decoration:none; }
.falling-blocks { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.falling-blocks span { position:absolute; top:-24px; width:12px; aspect-ratio:1; background:var(--green); opacity:0; animation:fall var(--d) linear var(--t) infinite; }
.falling-blocks span:nth-child(3n) { background:var(--gold); }
.falling-blocks span:nth-child(1){left:6%;--d:17s;--t:-12s}.falling-blocks span:nth-child(2){left:14%;width:8px;--d:22s;--t:-4s}
.falling-blocks span:nth-child(3){left:23%;width:16px;--d:19s;--t:-16s}.falling-blocks span:nth-child(4){left:34%;width:9px;--d:24s;--t:-8s}
.falling-blocks span:nth-child(5){left:43%;width:13px;--d:18s;--t:-2s}.falling-blocks span:nth-child(6){left:54%;width:7px;--d:21s;--t:-14s}
.falling-blocks span:nth-child(7){left:63%;width:15px;--d:23s;--t:-6s}.falling-blocks span:nth-child(8){left:72%;width:9px;--d:18s;--t:-17s}
.falling-blocks span:nth-child(9){left:81%;width:14px;--d:22s;--t:-10s}.falling-blocks span:nth-child(10){left:89%;width:8px;--d:20s;--t:-3s}
.falling-blocks span:nth-child(11){left:96%;width:12px;--d:25s;--t:-19s}.falling-blocks span:nth-child(12){left:29%;width:7px;--d:20s;--t:-11s}
@keyframes fall { 0%{opacity:0;transform:translate3d(0,-5vh,0) rotate(0)} 12%,82%{opacity:.28} 100%{opacity:0;transform:translate3d(20px,110vh,0) rotate(90deg)} }
@media (prefers-reduced-motion:reduce) { .falling-blocks { display:none; } html { scroll-behavior:auto; } }
header, main, footer { position:relative; z-index:1; }
.nav { position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px max(20px,calc((100% - 1080px)/2)); background:rgba(14,18,16,.92); border-bottom:1px solid var(--line); backdrop-filter:blur(8px); }
.brand { font-weight:800; letter-spacing:.02em; }
.brand b { color:var(--gold); }
.nav nav { display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted); font-size:.95rem; }
.nav nav a:hover { color:var(--text); }
.wrap { width:min(1080px,calc(100% - 40px)); margin:0 auto; }
.hero { padding:96px 0 72px; }
.hero h1 { margin:0 0 16px; font-size:clamp(2.4rem,6vw,4.2rem); line-height:1.05; }
.hero h1 em { color:var(--green); font-style:normal; }
.hero p { max-width:620px; margin:0 0 28px; color:var(--muted); font-size:1.1rem; }
.btns { display:flex; flex-wrap:wrap; gap:12px; }
.btn { display:inline-block; padding:12px 22px; border:1px solid var(--line); background:var(--surface); font-weight:700; transition:transform .15s,border-color .15s; }
.btn:hover { transform:translateY(-2px); border-color:var(--green); }
.btn.primary { background:var(--green); color:#0e1210; border-color:var(--green); }
section { padding:56px 0; border-top:1px solid var(--line); }
h2 { margin:0 0 8px; font-size:1.8rem; }
.lead { margin:0 0 28px; color:var(--muted); }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; }
.card { padding:20px; background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--gold); }
.card h3 { margin:0 0 6px; font-size:1.05rem; }
.card p { margin:0; color:var(--muted); font-size:.95rem; }
.cmd-group { margin-bottom:26px; }
.cmd-group h3 { margin:0 0 10px; color:var(--gold); font-size:.85rem; letter-spacing:.12em; text-transform:uppercase; }
.cmds { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:8px; }
.cmds div { padding:10px 14px; background:var(--surface); border:1px solid var(--line); font-size:.93rem; color:var(--muted); }
.cmds code { color:var(--green); font-weight:700; margin-right:6px; }
.badge { margin-left:6px; padding:1px 6px; background:var(--raised); border:1px solid var(--line); font-size:.72rem; color:var(--gold); }
details { margin-bottom:10px; background:var(--surface); border:1px solid var(--line); }
summary { padding:14px 18px; cursor:pointer; font-weight:700; }
details p { margin:0; padding:0 18px 16px; color:var(--muted); }
.doc { padding:64px 0; max-width:820px; }
.doc h1 { margin:0 0 6px; font-size:2.2rem; }
.doc h2 { margin:34px 0 8px; font-size:1.25rem; color:var(--gold); }
.doc p, .doc li { color:#d6d9d2; }
.doc .meta { color:var(--muted); }
.doc .note { padding:12px 16px; background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--green); }
footer { padding:32px 0; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
footer .wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; }
footer a:hover { color:var(--text); }