:root {
  color-scheme: light dark;
  --fg:#1a1a1a; --muted:#5c5c5c; --bg:#fdfdfc; --rule:#e5e3df; --accent:#2b62d9;
}
@media (prefers-color-scheme: dark) {
  :root { --fg:#ececec; --muted:#a2a2a2; --bg:#151515; --rule:#2e2e2e; --accent:#7ba3f5; }
}
* { box-sizing: border-box; }
body {
  margin:0; background:var(--bg); color:var(--fg);
  font:16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.wrap { max-width: 44rem; margin: 0 auto; padding: 3rem 1.25rem 5rem; }
header { border-bottom: 1px solid var(--rule); padding-bottom: 1.25rem; margin-bottom: 2rem; }
.brand { font-weight: 650; letter-spacing:-0.01em; font-size: 1.05rem; }
.brand a { color: inherit; text-decoration: none; }
h1 { font-size: 1.9rem; line-height:1.2; letter-spacing:-0.02em; margin:.6rem 0 .35rem; }
.updated, .tag { color: var(--muted); font-size:.875rem; margin:0; }
h2 { font-size: 1.1rem; margin: 2.2rem 0 .5rem; letter-spacing:-0.01em; }
p { margin: .7rem 0; }
ul { margin:.6rem 0; padding-left: 1.15rem; }
li { margin:.3rem 0; }
a { color: var(--accent); }
footer {
  margin-top:3.5rem; padding-top:1.25rem; border-top:1px solid var(--rule);
  color:var(--muted); font-size:.875rem;
}
/* Landing page */
body.home { min-height:100vh; display:flex; align-items:center; justify-content:center; }
body.home .wrap { max-width: 34rem; padding: 2rem 1.25rem; }
body.home h1 { font-size: 2.1rem; margin:0 0 .4rem; }
body.home .tag { font-size:1rem; margin:0 0 2rem; }
body.home nav a { margin-right: 1.25rem; }