:root { --navy:#1B365D; --ink:#111827; --muted:#6B7280; --card:#fff; --bg:#F4F6F9; --line:rgba(27,54,93,.10); }
@media (prefers-color-scheme: dark) { :root { --ink:#F3F4F6; --muted:#9CA3AF; --card:#1A1B1F; --bg:#0E0F11; --line:rgba(255,255,255,.08); } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.6 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
header { background:var(--navy); color:#fff; padding:28px 16px 24px; text-align:center; }
header img { width:56px; height:56px; border-radius:14px; border:3px solid rgba(255,255,255,.5); }
header h1 { margin:10px 0 2px; font-size:24px; }
header p { margin:0; opacity:.8; font-size:14px; }
main { max-width:760px; margin:0 auto; padding:24px 16px 48px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:22px 22px 8px; }
h2 { font-size:18px; margin:22px 0 6px; color:var(--navy); }
@media (prefers-color-scheme: dark) { h2 { color:#9DB7E0; } }
h2:first-child { margin-top:0; }
p, li { color:var(--ink); }
.muted { color:var(--muted); font-size:14px; }
a { color:#2F6FB5; }
nav { text-align:center; margin-top:18px; font-size:14px; }
nav a { margin:0 8px; }
.lang { text-align:right; font-size:13px; margin-bottom:10px; }
.btn { display:inline-block; background:var(--navy); color:#fff; text-decoration:none; padding:12px 18px; border-radius:12px; font-weight:600; }