:root { color-scheme: light dark; }
body { max-width: 42rem; margin: 0 auto; padding: 3rem 1.25rem 5rem;
  font: 17px/1.65 Georgia, "Times New Roman", serif; color: #23262b; background: #fbfaf8; }
header { border-bottom: 1px solid #e3ded6; padding-bottom: 1.25rem; margin-bottom: 2rem; }
h1 { font-size: 1.8rem; margin: 0 0 .35rem; letter-spacing: -.01em; }
.sub { margin: 0; color: #6d6a63; font-style: italic; }
article { margin-bottom: 2.5rem; }
h2 { font-size: 1.25rem; margin: 0 0 .25rem; }
.date { margin: 0 0 .6rem; color: #8b877f; font-size: .82rem; font-family: system-ui, sans-serif; }
p { margin: 0 0 .9rem; }
footer { border-top: 1px solid #e3ded6; padding-top: 1rem; color: #8b877f; font-size: .85rem; }
@media (prefers-color-scheme: dark) {
  body { background: #16181b; color: #d9d6d0; }
  header, footer { border-color: #2b2e33; }
  .sub, .date, footer { color: #8b877f; }
}