:root { color-scheme: dark; --bg:#080a0e; --fg:#e8eef2; --muted:#8c98a3; --glow:#75dbff; --card:#12161c; --line:#232a33; }
* { box-sizing: border-box; }
body { margin:0; background:radial-gradient(1200px 500px at 50% -10%, #17313b 0%, var(--bg) 60%) no-repeat, var(--bg); color:var(--fg);
  font:17px/1.65 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "PingFang SC", "Hiragino Sans", sans-serif; }
main { max-width: 760px; margin: 0 auto; padding: 56px 22px 80px; }
h1 { font-size: 40px; letter-spacing: -0.5px; margin: 0 0 6px; }
h2 { font-size: 22px; margin: 40px 0 8px; }
p, li { color: #cdd6dd; }
a { color: var(--glow); text-decoration: none; } a:hover { text-decoration: underline; }
.tag { color: var(--muted); font-size: 18px; margin: 0 0 30px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 18px 22px; margin: 14px 0; }
nav { display:flex; gap:18px; margin-bottom: 36px; font-size:15px; }
nav a { color: var(--muted); } nav a.on { color: var(--fg); }
.lang { color: var(--muted); font-size: 14px; margin: 26px 0 0; }
footer { margin-top: 60px; color: var(--muted); font-size: 14px; }
.icon { width: 96px; height: 96px; border-radius: 22px; box-shadow: 0 10px 40px rgba(117,219,255,.18); margin-bottom: 22px; }