:root{color-scheme:dark;--bg:#141416;--fg:#ececef;--muted:#a3a3ad;--accent:#ff764a;--card:#1f1f23;--border:#2e2e34}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:18px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent)}
header,main,footer{max-width:760px;margin:0 auto;padding:0 16px}
header{display:flex;justify-content:space-between;align-items:center;padding-top:20px;padding-bottom:20px;flex-wrap:wrap;gap:8px}
.logo{font-weight:800;font-size:1.3rem;text-decoration:none;color:var(--fg)}
.logo span{color:var(--accent)}
nav a{margin-left:16px;text-decoration:none}
h1{line-height:1.2;font-size:2.1rem;margin:.4em 0}
h2{margin-top:1.8em;line-height:1.3}
.lede{color:var(--muted);font-size:1.15rem}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));padding:0;list-style:none}
.cards li{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px}
.cards a{font-weight:700;text-decoration:none}
.cards p{margin:.4em 0 0;color:var(--muted);font-size:.95rem}
.box{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;margin:32px 0}
.box h2{margin-top:0}
ol li,ul li{margin-bottom:.6em}
.meta{color:var(--muted);font-size:.9rem}
footer{color:var(--muted);font-size:.85rem;border-top:1px solid var(--border);margin-top:48px;padding-top:16px;padding-bottom:32px}
footer a{margin-right:12px}