:root { --bg: #fff; --fg: #1c1e21; --muted: #65676b; --card: #f0f2f5; --accent: #0866ff; }
@media (prefers-color-scheme: dark) { :root { --bg: #18191a; --fg: #e4e6eb; --muted: #b0b3b8; --card: #242526; --accent: #4599ff; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 17px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
main { max-width: 640px; margin: 0 auto; padding: 56px 16px; }
header { text-align: center; margin-bottom: 40px; }
header img { width: 112px; height: 112px; }
h1 { margin: 8px 0 4px; font-size: 40px; }
h2 { margin-top: 40px; font-size: 22px; }
p, li { color: var(--fg); }
.muted, footer { color: var(--muted); font-size: 15px; }
.btn { display: inline-block; margin-top: 16px; padding: 12px 24px; border-radius: 999px; background: var(--accent); color: #fff; font-weight: 600; text-decoration: none; }
.card { background: var(--card); border-radius: 16px; padding: 4px 24px; }
a { color: var(--accent); }
code { background: var(--card); padding: 2px 6px; border-radius: 6px; font-size: 15px; }
footer { margin-top: 56px; text-align: center; }