
:root{
  --bg:#070711; --panel:#0b0f1f; --ink:#eaf2ff; --muted:#9bb0c9;
  --primary:#6e9bff; --accent:#a86bff; --stroke:rgba(255,255,255,0.1);
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0; color:var(--ink); background:var(--bg); font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, 'Helvetica Neue', Arial;}
a{color:inherit; text-decoration:none}
.layout{display:grid; grid-template-columns: 260px 1fr; gap:0; min-height:100vh}
.aside{position:sticky; top:0; align-self:start; height:100vh; overflow:auto; background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)); border-right:1px solid var(--stroke); padding:18px}
.brand{display:flex; align-items:center; gap:10px; font-weight:800; margin-bottom:10px}
.brand img{width:28px; height:28px; border-radius:8px}
.search{margin:12px 0 16px}
.search input{width:100%; padding:10px 12px; border-radius:12px; border:1px solid var(--stroke); background:var(--panel); color:var(--ink)}
.nav a{display:block; padding:9px 10px; border-radius:10px; opacity:.9}
.nav a:hover{background:rgba(255,255,255,.06); opacity:1}
main{padding:26px 26px 60px}
h1{font-size: clamp(26px,4vw,38px); margin:8px 0 8px; background:linear-gradient(90deg,#aee3ff,#b98bff); -webkit-background-clip:text; color:transparent}
h2{margin-top:28px}
.lead{color:var(--muted); max-width:800px}
.card{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); border:1px solid var(--stroke); border-radius:14px; padding:16px; margin:12px 0}
code, pre{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono','Courier New', monospace}
pre{background:#0b0f1f; border:1px solid var(--stroke); border-radius:12px; padding:14px; overflow:auto}
.table{width:100%; border-collapse:collapse; margin:10px 0}
.table td,.table th{border:1px solid var(--stroke); padding:10px; text-align:left}
.note{border-left:3px solid var(--primary); padding:10px 12px; background:rgba(110,155,255,.08); border-radius:8px; color:#dbe9ff}
footer{border-top:1px solid var(--stroke); margin-top:24px; padding-top:14px; color:var(--muted); font-size:13px}
.btn{display:inline-flex; gap:8px; align-items:center; padding:10px 14px; border-radius:12px; border:1px solid var(--stroke); background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.04));}
.btn:hover{box-shadow:0 10px 24px rgba(110,155,255,.25)}
.badge{display:inline-block; padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid var(--stroke); font-size:12px; margin-right:6px}
kbd{background:#0b0f1f; border:1px solid var(--stroke); border-radius:6px; padding:1px 6px}
