:root { --bg:#0f1419; --fg:#d7e2ea; --mute:#7f8b96; --line:#24303a; --acc:#3aa0c8; }
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:var(--bg); color:var(--fg); font-family: ui-sans-serif, system-ui, sans-serif; line-height:1.55; }
header, main, footer { max-width: 40rem; margin: 0 auto; padding: 0 1.2rem; }
header { padding-top: 2.4rem; padding-bottom: 1.2rem; border-bottom: 1px solid var(--line); }
.kicker { letter-spacing: .16em; text-transform: uppercase; font-size: .72rem; color: var(--acc); }
h1 { font-size: 1.6rem; font-weight: 600; margin: .35rem 0 .2rem; }
nav a { color: var(--fg); margin-right: 1rem; text-decoration: none; border-bottom: 1px solid var(--line); }
nav a:hover { border-bottom-color: var(--acc); }
main { padding: 2rem 1.2rem 3rem; }
p { color: var(--mute); }
code { color: var(--fg); }
footer { border-top: 1px solid var(--line); padding: 1.2rem; color: var(--mute); font-size: .9rem; }