:root { --max: 720px; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; line-height:1.6; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 24px; }
header, footer { display:flex; justify-content:space-between; align-items:center; }
.brand { font-weight:700; text-decoration:none; }
h1 { line-height:1.2; margin: 24px 0; }
.postlist { list-style:none; padding:0; margin:0; }
.postlist li { display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid #eee; }
.postlist a { text-decoration:none; }
.meta { color:#666; font-size:0.9rem; }
.post { margin-top:8px; }
.post .meta { color:#666; margin-top:-8px; }
.back { text-decoration:none; }
@media (prefers-color-scheme: dark) {
  body { background:#0b0b0b; color:#eaeaea; }
  .postlist li { border-color:#222; }
  .meta { color:#aaa; }
}

footer {justify-content:center;}