:root { color-scheme: dark light; }
* { box-sizing: border-box; }
body {
  margin: 0;
  font: 16px/1.6 ui-monospace, "JetBrains Mono", "Fira Code", monospace;
  background: #101014;
  color: #d8d8dc;
  min-height: 100vh;
  display: flex; flex-direction: column;
}
header { padding: 1rem 2rem; border-bottom: 1px solid #26262c; }
nav { display: flex; gap: 1.5rem; align-items: center; }
nav a { color: #9a9aa4; text-decoration: none; }
nav a:hover { color: #7ee787; }
.brand { color: #7ee787; font-weight: 600; }
main { flex: 1; max-width: 640px; margin: 0 auto; padding: 4rem 1.5rem; width: 100%; }
h1 { font-size: 2rem; margin-bottom: .25rem; }
.tagline { color: #9a9aa4; margin-top: 0; }
h2 { margin-top: 2.5rem; font-size: 1.2rem; color: #9a9aa4; }
a { color: #79c0ff; }
.postlist { list-style: none; padding: 0; }
.postlist li { padding: .4rem 0; border-bottom: 1px solid #1c1c22; }
.date { color: #6a6a74; font-size: .85rem; float: right; }
pre { background: #1a1a20; padding: .8rem 1rem; overflow-x: auto; }
code { background: #1a1a20; padding: .1rem .3rem; }
footer { padding: 1rem 2rem; color: #6a6a74; border-top: 1px solid #26262c; font-size: .85rem; }
@media (prefers-color-scheme: light) {
  body { background: #fafafa; color: #1a1a1e; }
  header, footer { border-color: #e2e2e6; }
  .brand { color: #116329; }
  pre, code { background: #ececf0; }
}