:root { --bg:#FFF8EF; --surface:#FFFFFF; --text:#2A1C14; --muted:#6B5A4E; --primary:#1E6A4E; --accent:#F26B3A; --border:#E5D3BF; }
@media (prefers-color-scheme: dark) { :root { --bg:#17120F; --surface:#221B17; --text:#F7EDE3; --muted:#BFAE9F; --primary:#6CCB9F; --accent:#F58A5F; --border:#4A3D34; } }
* { 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; }
.shell { max-width: 760px; margin: 0 auto; padding: 0 16px; }
header { display:flex; align-items:center; justify-content:space-between; padding:20px 16px; }
.brand { display:flex; align-items:center; gap:10px; font-family:"Fredoka", sans-serif; font-weight:600; font-size:22px; text-decoration:none; color:var(--text); }
.brand img { width:36px; height:36px; border-radius:9px; }
nav a { color:var(--primary); margin-left:16px; text-decoration:none; font-weight:600; }
h1, h2 { font-family:"Fredoka", sans-serif; font-weight:600; line-height:1.2; }
h1 { font-size:34px; margin:24px 0 8px; }
h2 { font-size:21px; margin-top:32px; }
a { color:var(--primary); }
.muted { color:var(--muted); font-size:14px; }
.card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:16px; margin:16px 0; }
.hero { text-align:center; padding:40px 0 16px; }
.hero img { width:112px; height:112px; border-radius:26px; }
.hero h1 { font-size:42px; }
footer { padding:32px 16px 48px; color:var(--muted); font-size:14px; text-align:center; }