:root{--ink:#161617;--muted:#4a4a55;--brand:#320096;--bg:#f6f5fa}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.5}
.top{background:linear-gradient(135deg,#320096,#eb0055);color:#fff;padding:2.5rem 1rem 2rem;text-align:center}
.top h1{margin:.25rem 0 .5rem;font-size:2rem}
.tag{display:inline-block;margin:0;font-size:.8rem;background:rgba(255,255,255,.2);border-radius:1rem;padding:.15rem .7rem}
.lead{max-width:40rem;margin:0 auto;font-size:1.05rem}
.wrap{max-width:52rem;margin:1.5rem auto;padding:0 1rem;display:grid;gap:1rem}
.card{background:#fff;border:1px solid #e3e1ec;border-radius:1rem;padding:1.25rem 1.5rem}
.card h2{margin-top:0;font-size:1.2rem;color:var(--brand)}
pre{background:#161617;color:#f6f5fa;padding:.75rem;border-radius:.5rem;overflow-x:auto;font-size:.85rem}
.small{font-size:.9rem;color:var(--muted)}
.foot{text-align:center;color:var(--muted);font-size:.85rem;padding:1.5rem 1rem 6rem}