:root{
      --bg:#0f1220; --card:#14182b; --ink:#e9ecff; --muted:#a9b0d9;
      --accent:#7c8cff; --ok:#62d394; --warn:#ffcc66; --err:#ff7a7a;
      --code:#0b0e1a; --bord:#1f2440;
    }
    *{box-sizing:border-box}
    body{margin:0; font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color:var(--ink); background:linear-gradient(180deg,#0e1120,#0b0e19);}
    header{padding:48px 20px 24px; text-align:center}
    header h1{margin:0; font-size:clamp(26px,3.2vw,40px); letter-spacing:.2px}
    header p{margin:.5rem auto 0; max-width:850px; color:var(--muted)}
    main{max-width:980px; margin:0 auto; padding:10px 20px 80px}
    section{background:var(--card); border:1px solid var(--bord); border-radius:18px; padding:22px; margin:18px 0; box-shadow:0 20px 60px rgba(0,0,0,.25)}
    h2{font-size:22px; margin:0 0 12px}
    h3{font-size:18px; margin:18px 0 8px}
    ol{margin:0; padding-left:22px}
    li{margin:10px 0}
    code, pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
    pre{background:var(--code); color:#e7eaff; border:1px solid var(--bord); border-radius:12px; padding:14px; overflow:auto}
    .cmd{display:block; white-space:pre}
    kbd{background:#1b2040; border:1px solid var(--bord); padding:0 .5rem; border-radius:6px; font-size:.95em}
    .grid{display:grid; gap:14px}
    @media(min-width:880px){.grid{grid-template-columns:1fr 1fr}}
    .tip,.warn,.err,.ok{border:1px solid var(--bord); border-left:6px solid var(--accent); background:#11162b; color:var(--ink); padding:12px 14px; border-radius:12px}
    .warn{border-left-color:var(--warn)}
    .err{border-left-color:var(--err)}
    .ok{border-left-color:var(--ok)}
    .pill{display:inline-block; padding:.2rem .55rem; border:1px solid var(--bord); border-radius:999px; background:#101630; color:var(--muted); font-size:.85em}
    .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}