:root { --ink:#0f172a; --muted:#475569; --line:#e2e8f0; --brand:#1E73F0; --bg:#f8fafc; --card:#fff; }
@media (prefers-color-scheme: dark) { :root { --ink:#e2e8f0; --muted:#94a3b8; --line:#1e293b; --bg:#0b1120; --card:#0f172a; --brand:#4C93F5; } }
* { box-sizing: border-box; }
body { margin:0; font:17px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color:var(--ink); background:var(--bg); }
header { background: linear-gradient(135deg,#1E73F0,#8B5CF6 60%,#EC4899); color:#fff; padding:56px 20px 64px; text-align:center; }
header img { width:88px; height:88px; border-radius:22px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
header h1 { margin:16px 0 4px; font-size:34px; letter-spacing:-.5px; }
header p { margin:0; opacity:.9; }
nav { display:flex; gap:20px; justify-content:center; margin-top:20px; flex-wrap:wrap; }
nav a { color:#fff; opacity:.9; text-decoration:none; font-weight:600; }
nav a:hover { opacity:1; text-decoration:underline; }
main { max-width:760px; margin:-32px auto 48px; padding:0 16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:28px 28px 20px; margin-bottom:20px; }
h2 { font-size:22px; margin:0 0 10px; }
h3 { font-size:18px; margin:22px 0 6px; }
p, li { color:var(--muted); }
a { color:var(--brand); }
.updated { font-size:14px; color:var(--muted); }
footer { text-align:center; color:var(--muted); font-size:14px; padding:0 16px 40px; }