:root { --bg:#0A0A10; --surface:#14141D; --text:#F4F4F8; --muted:#9A9AAE; --border:rgba(255,255,255,.08); --brand:#FF2E7E; }
@media (prefers-color-scheme: light) { :root { --bg:#F7F5F8; --surface:#FFFFFF; --text:#14141D; --muted:#6B6B7B; --border:rgba(0,0,0,.08); } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
header, main, footer { max-width: 760px; margin: 0 auto; padding: 0 20px; }
header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding-top:20px; padding-bottom:12px; border-bottom:1px solid var(--border); }
.logo { font-weight:900; font-size:26px; letter-spacing:-1px; text-decoration:none;
  background:linear-gradient(135deg,#7C3AED,#FF2E7E 45%,#FF7A45 80%,#FFB547); -webkit-background-clip:text; background-clip:text; color:transparent; }
nav a { color:var(--muted); text-decoration:none; margin-left:16px; font-weight:600; }
nav a.active, nav a:hover { color:var(--brand); }
h1 { font-size:32px; letter-spacing:-.5px; margin:32px 0 4px; }
h2 { font-size:18px; margin:28px 0 6px; }
p { margin:0; color:var(--muted); }
a { color:var(--brand); }
.muted { color:var(--muted); font-size:14px; }
section { background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:4px 18px 16px; margin-top:14px; }
footer { color:var(--muted); font-size:14px; padding-top:32px; padding-bottom:40px; }
footer a { margin-left:10px; }