:root { --bg:#f5f7f9; --panel:#fff; --ink:#1b2330; --muted:#5b677a; --line:#e4e8ee; --accent:#1b6bff; --accent-2:#0aa2c0; --ok:#0f8a5f;} *{box-sizing:border-box} html,body{margin:0;padding:0} body{font-family:IBM Plex Sans,Segoe UI,sans-serif;background:var(--bg);color:var(--ink);display:grid;grid-template-columns:280px 1fr;min-height:100vh} a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline} .side{background:#0f1723;color:#d7deea;padding:28px 22px} .side .brand{font-weight:700;letter-spacing:.12em;font-size:12px;color:#7fd0ff} .side h1{font-size:22px;margin:10px 0 6px;color:#fff} .nav{margin-top:28px;display:flex;flex-direction:column;gap:6px} .nav a{color:#c9d3e2;padding:8px 10px;border-radius:8px;font-size:14px} .nav a.active,.nav a:hover{background:#1b2a40;color:#fff;text-decoration:none} .main{padding:42px 56px 80px;max-width:920px} .kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);font-weight:700} h2{font-size:32px;margin:8px 0 16px} p,li{line-height:1.6} .card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin:18px 0} .mono,code{font-family:IBM Plex Mono,ui-monospace,monospace;font-size:13px} table{border-collapse:collapse;width:100%;font-size:14px} th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top} .badge{display:inline-block;background:#e8f8f1;color:var(--ok);padding:2px 8px;border-radius:999px;font-size:12px;font-weight:700} .foot{margin-top:48px;color:var(--muted);font-size:13px} @media(max-width:860px){body{grid-template-columns:1fr}}