:root { color-scheme: light dark; }
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  line-height: 1.6;
  color: #1a1a1a;
  background: #fafcfb;
}
.wrap { max-width: 760px; margin: 0 auto; padding: 48px 20px; }
.center { max-width: 520px; margin: 12vh auto; padding: 24px; text-align: center; }
h1 { font-size: 2rem; margin: 0 0 8px; }
h2 { margin-top: 36px; }
.tag { color: #1f9c73; font-weight: 600; }
.muted { color: #555; }
.small { font-size: .9rem; }
ul { padding-left: 1.2em; }
.btn {
  display: inline-block; background: #1f9c73; color: #fff; border: 0;
  padding: 14px 22px; border-radius: 999px; font-size: 1rem; font-weight: 600;
  cursor: pointer; text-decoration: none; margin: 12px 0;
}
.btn:hover { background: #18815f; }
a { color: #1f9c73; }
nav a { margin-right: 16px; }
footer { margin-top: 48px; padding-top: 16px; border-top: 1px solid #ddd; color: #777; font-size: .85rem; }
@media (prefers-color-scheme: dark) {
  body { background: #0f1419; color: #e6e6e6; }
  .muted { color: #aaa; }
  footer { border-color: #333; color: #888; }
}