:root { color-scheme: light dark; }
body { font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; margin: 0;
       color: #1c2430; background: #f6f7f9; }
main { max-width: 44rem; margin: 0 auto; padding: 2.5rem 1.25rem 4rem; }
header.site { border-bottom: 1px solid #d5dae2; padding-bottom: 1rem; margin-bottom: 1.5rem; }
header.site .org { font-size: .9rem; color: #566273; margin: 0; }
h1 { font-size: 1.7rem; line-height: 1.2; margin: .2rem 0 0; }
h2 { font-size: 1.15rem; margin: 2rem 0 .4rem; }
p, li { max-width: 40rem; }
a { color: #0b5cad; }
.box { background: #fff; border: 1px solid #d5dae2; border-radius: 8px; padding: 1rem 1.2rem; margin: 1.2rem 0; }
.box p { margin: .4rem 0; }
nav.foot { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid #d5dae2; font-size: .9rem; color: #566273; }
nav.foot a { margin-right: 1rem; }
code { background: #e9ecf1; padding: .05rem .3rem; border-radius: 4px; }
@media (prefers-color-scheme: dark) {
  body { color: #e6e9ee; background: #14181e; }
  header.site, nav.foot { border-color: #333b47; }
  header.site .org, nav.foot { color: #9aa6b6; }
  a { color: #7db8f2; }
  .box { background: #1b2129; border-color: #333b47; }
  code { background: #2a323d; }
}