:root{--navy:#1c2a5c;--indigo:#3a4ea8;--gold:#e2ad4a;--bg:#f7f9ff;--ink:#1a1d29;--muted:#5b6172;--card:#fff;--line:#e6e9f2}
@media(prefers-color-scheme:dark){:root{--bg:#0f1220;--ink:#eef1fb;--muted:#a6adc2;--card:#171a29;--line:#262a3d}}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.65}
.wrap{max-width:760px;margin:0 auto;padding:32px 20px 80px}
header.site{background:linear-gradient(135deg,var(--navy),var(--indigo));color:#fff;padding:40px 20px}
header.site .wrap{padding-bottom:32px}
.brand{display:flex;align-items:center;gap:14px}
.logo{width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,var(--navy),var(--indigo));display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.25);font-size:28px}
h1{font-size:1.9rem;margin:.2em 0}
h2{margin-top:1.8em;font-size:1.25rem;color:var(--ink)}
a{color:var(--indigo)}
header.site a{color:#fff}
.muted{color:var(--muted);font-size:.92rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:18px 0}
.btnrow{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.btn{display:inline-block;padding:12px 20px;border-radius:12px;background:#fff;color:var(--navy);text-decoration:none;font-weight:600}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.5);color:#fff}
nav.top{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:.95rem}
footer{border-top:1px solid var(--line);margin-top:40px;padding-top:20px;color:var(--muted);font-size:.85rem}
ul{padding-left:1.2em}
code{background:rgba(128,128,128,.15);padding:1px 6px;border-radius:5px}