:root{
  --bg:#0b0f17;
  --panel:#0f1522;
  --panel2:#0c111d;
  --text:#e6e9ef;
  --muted:#a8b0c2;
  --border:rgba(255,255,255,.08);
  --brand:#5b8cff;
  --brand2:#8a7dff;
  --codebg:#0a0e16;
  --shadow:0 8px 30px rgba(0,0,0,.35);
  --radius:14px;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
  --sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#f7f8fb;
    --panel:#ffffff;
    --panel2:#fbfcff;
    --text:#0f172a;
    --muted:#475569;
    --border:rgba(15,23,42,.10);
    --brand:#2f5cff;
    --brand2:#6b5cff;
    --codebg:#0b1020;
    --shadow:0 10px 30px rgba(15,23,42,.10);
  }
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.55;}
a{color:var(--brand);text-decoration:none;}
a:hover{text-decoration:underline;}
.layout{display:grid;grid-template-columns:280px 1fr;min-height:100vh;}
.sidebar{position:sticky;top:0;height:100vh;border-right:1px solid var(--border);padding:18px 16px;background:linear-gradient(180deg,var(--panel2),transparent);}
.brand{display:flex;align-items:center;gap:10px;padding:10px 10px 14px;border-radius:12px;}
.logo{width:34px;height:34px;border-radius:10px;background:radial-gradient(circle at 30% 30%,var(--brand2),var(--brand));box-shadow:var(--shadow);}
.brand h1{font-size:14px;margin:0;letter-spacing:.2px;}
.brand .sub{display:block;font-size:11px;color:var(--muted);margin-top:2px;}
.nav{margin-top:10px;display:flex;flex-direction:column;gap:4px;}
.nav a{padding:10px 10px;border-radius:12px;color:var(--text);border:1px solid transparent;}
.nav a.active{background:var(--panel);border-color:var(--border);box-shadow:var(--shadow);}
.nav a span{display:block;font-size:12px;color:var(--muted);}
.main{padding:28px 26px 64px;}
.container{max-width:1060px;margin:0 auto;}
.hero{padding:22px 22px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);}
.hero h2{margin:0 0 8px;font-size:22px;letter-spacing:.1px;}
.hero p{margin:0;color:var(--muted);}
.grid{margin-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px 16px;}
.card h3{margin:0 0 6px;font-size:14px;}
.card p{margin:0;color:var(--muted);font-size:13px;}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(91,140,255,.14);border:1px solid rgba(91,140,255,.25);color:var(--text);font-size:12px;}
.section{margin-top:18px;}
.section h3{margin:0 0 8px;font-size:16px;}
.kv{display:grid;grid-template-columns:180px 1fr;gap:10px 14px;font-size:13px;margin-top:8px;}
.kv .k{color:var(--muted);}
pre{background:var(--codebg);color:#e8eeff;padding:14px 14px;border-radius:12px;overflow:auto;border:1px solid rgba(255,255,255,.08);font-family:var(--mono);font-size:12px;}
table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden;font-size:13px;}
th,td{padding:10px 10px;border-bottom:1px solid var(--border);vertical-align:top;}
th{color:var(--muted);text-align:left;font-weight:600;background:linear-gradient(180deg,rgba(255,255,255,.02),transparent);}
tr:last-child td{border-bottom:none;}
.note{padding:12px 12px;border-radius:12px;background:rgba(255,193,7,.12);border:1px solid rgba(255,193,7,.24);color:var(--text);font-size:13px;}
.note strong{color:var(--text);}
.small{font-size:12px;color:var(--muted);}
.footer{margin-top:28px;color:var(--muted);font-size:12px;}
@media (max-width:960px){.layout{grid-template-columns:1fr;}.sidebar{height:auto;position:relative;}.grid{grid-template-columns:1fr;}}