:root {
  color-scheme: light dark;
  --bg: #0d0f12;
  --panel: #15181d;
  --text: #f4f6f8;
  --muted: #aeb6c0;
  --line: #2a3038;
  --accent: #f0b323;
  --link: #7db7ff;
  --max: 900px;
}
*{box-sizing:border-box}
html{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.6;background:var(--bg);color:var(--text)}
body{margin:0}
main{max-width:var(--max);margin:0 auto;padding:48px 24px 72px}
header{margin-bottom:32px;padding-bottom:20px;border-bottom:1px solid var(--line)}
h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1;margin:0 0 12px}
h2{font-size:1.35rem;margin-top:2.2rem}
h3{font-size:1.05rem;margin-top:1.6rem}
p,li{font-size:1rem}
small,.muted{color:var(--muted)}
a{color:var(--link)}
nav{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
nav a{padding:8px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none}
.notice{background:var(--panel);border-left:4px solid var(--accent);padding:14px 16px;border-radius:8px;margin:20px 0}
.contact{background:var(--panel);padding:16px;border-radius:10px}
ul{padding-left:1.2rem}
footer{margin-top:48px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted)}
code{background:var(--panel);padding:.1rem .35rem;border-radius:4px}
@media (prefers-color-scheme: light){
  :root{--bg:#fff;--panel:#f6f7f9;--text:#15181d;--muted:#5e6875;--line:#dce1e7;--link:#075db8}
}