:root { --bg:#0b0f17; --ink:#e8ecf1; --muted:#9aa7b2; --card:#111827; --link:#60a5fa; --accent:#22d3ee; }
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;background:#0b1220;color:var(--ink);line-height:1.55}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.topbar{background:linear-gradient(90deg,var(--card),#0b1220 60%,#0b1220);border-bottom:1px solid #1f2937}
.topbar .flex{display:flex;align-items:center;gap:16px;padding:12px 0}
.brand{color:#fff;text-decoration:none;font-weight:700}
.brand .muted{color:var(--muted);font-weight:500}
.search input{background:#0f172a;border:1px solid #1f2937;border-radius:8px;padding:10px 12px;color:#e5e7eb;min-width:220px}
.nav{background:#0b1220;position:sticky;top:0;z-index:2;border-bottom:1px solid #1f2937}
.nav ul{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:10px 0}
.nav a{display:block;padding:8px 10px;border-radius:8px;text-decoration:none;color:#cbd5e1;border:1px solid #1f2937;background:#0f172a}
.nav a:hover{border-color:#334155;color:#fff}
.content{padding:24px 0}
.card{background:#0f172a;border:1px solid #1f2937;border-radius:12px;padding:18px;margin:12px 0}
h1,h2,h3{line-height:1.2}
code,pre{background:#0b1220;border:1px solid #1f2937;border-radius:8px;padding:.2em .4em}
pre{padding:12px;overflow:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border:1px solid #1f2937;padding:8px;text-align:left}
.footer{border-top:1px solid #1f2937;margin-top:40px;color:#94a3b8}
kbd{background:#0b1220;border:1px solid #1f2937;border-radius:6px;padding:.15em .35em}
.note{border-left:4px solid var(--accent);padding:12px;background:#081120;border-radius:8px;margin:12px 0}