:root { color-scheme: light dark; --bg:#f4f7f7; --surface:#fff; --text:#172324; --muted:#596b6d; --teal:#0a8c82; --coral:#ed574a; --line:#dce4e5; }
* { box-sizing:border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:var(--bg); color:var(--text); line-height:1.65; }
header,main,footer { width:min(760px,calc(100% - 32px)); margin:auto; }
header { padding:56px 0 24px; }
main { background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:clamp(24px,5vw,48px); }
footer { padding:24px 0 48px; color:var(--muted); font-size:14px; }
h1 { margin:0 0 8px; font-size:clamp(32px,7vw,52px); letter-spacing:0; line-height:1.08; }
h2 { margin-top:32px; font-size:22px; letter-spacing:0; }
p,li { color:var(--muted); }
a { color:var(--teal); }
nav { display:flex; flex-wrap:wrap; gap:16px; margin-top:20px; }
.mark { color:var(--coral); font-weight:700; }
@media (prefers-color-scheme:dark) { :root { --bg:#101718; --surface:#182122; --text:#f5f8f8; --muted:#b8c4c5; --line:#344143; } }