:root { --ink:#0c1b2a; --nav:#07111e; --panel:#10243a; --line:#284665; --accent:#42c8ff; --gold:#ffcf57; --text:#edf6ff; --muted:#b6cee6; }
* { box-sizing:border-box; }
html { color-scheme:dark; background:var(--ink); }
body { margin:0; color:var(--text); font:16px/1.55 "Segoe UI",Arial,sans-serif; background:radial-gradient(circle at 78% 0,#183858 0,transparent 34rem),var(--ink); }
.layout { min-height:100vh; display:grid; grid-template-columns:260px minmax(0,1fr); }
.rail { position:sticky; top:0; height:100vh; padding:24px 17px; background:rgba(4,13,24,.92); border-right:1px solid var(--line); }
.brand { display:flex; gap:12px; align-items:center; font-size:21px; font-weight:700; line-height:1.08; }
.brand img { width:52px; height:52px; }.rail p { color:var(--muted); font-size:14px; }.rail-toggle { width:100%; margin:18px 0 10px; color:var(--text); background:#152b44; border:1px solid #355675; border-radius:8px; padding:8px; text-align:left; cursor:pointer; }
nav { display:grid; gap:4px; } nav a { padding:9px 11px; color:var(--muted); text-decoration:none; border-radius:7px; } nav a:hover,nav a[aria-current="page"] { color:#07111e; background:var(--gold); font-weight:700; }.language { margin-top:20px; display:flex; gap:6px; }.language button { background:transparent; border:1px solid #42617d; color:var(--text); border-radius:5px; cursor:pointer; padding:4px 9px; }
main { min-width:0; padding:28px clamp(22px,4vw,72px) 42px; }.top { max-width:1080px; border-bottom:1px solid var(--line); padding-bottom:24px; }.eyebrow { margin:0; color:var(--accent); font-weight:700; letter-spacing:.11em; text-transform:uppercase; font-size:12px; }.top h1 { font-size:clamp(38px,5vw,68px); line-height:1; margin:8px 0 14px; }.lead { color:var(--muted); max-width:720px; font-size:20px; }.actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:21px; }.button { display:inline-block; padding:11px 17px; background:#14324e; color:var(--text); text-decoration:none; border:1px solid #41698a; border-radius:7px; font-weight:700; }.button.primary { background:var(--accent); color:#06213a; border-color:var(--accent); }.content { max-width:1080px; }.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin:28px 0; }.card,.panel { background:rgba(10,28,47,.88); border:1px solid var(--line); border-radius:11px; padding:20px; margin:20px 0; }.card h2,.panel h2 { margin-top:0; color:#fff; }.card p,.panel p { color:var(--muted); }.card strong,.version { color:var(--gold); font-size:28px; } code { background:#07111e; padding:2px 5px; border-radius:4px; color:#d4eaff; overflow-wrap:anywhere; } a { color:var(--accent); } table { border-collapse:collapse; max-width:100%; } th,td { border-bottom:1px solid var(--line); padding:8px 12px; vertical-align:top; text-align:left; } th { color:var(--accent); } footer { max-width:1080px; margin-top:42px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; } [hidden] { display:none!important; }
@media (max-width:760px) { .layout { grid-template-columns:1fr; }.rail { position:relative; height:auto; }.rail.collapsed nav,.rail.collapsed .tagline,.rail.collapsed .language { display:none; } main { padding:24px 18px; } }