:root { color-scheme: light dark; }
* { box-sizing: border-box; }
body {
  font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  max-width: 760px; margin: 0 auto; padding: 32px 20px 80px;
  color: #1c1c1e; background: #ffffff;
}
@media (prefers-color-scheme: dark) { body { color: #e6e6ea; background: #000; } a { color: #4da6ff; } }
header { border-bottom: 1px solid rgba(127,127,127,.25); margin-bottom: 28px; padding-bottom: 16px; }
h1 { font-size: 1.7rem; margin: 0 0 6px; }
h2 { font-size: 1.18rem; margin: 32px 0 8px; }
.muted { color: #8a8a8e; font-size: .92rem; }
a { color: #0a84ff; text-decoration: none; }
a:hover { text-decoration: underline; }
nav a { margin-right: 16px; font-weight: 600; }
.card { border: 1px solid rgba(127,127,127,.25); border-radius: 14px; padding: 22px; margin: 14px 0; }
footer { margin-top: 48px; padding-top: 16px; border-top: 1px solid rgba(127,127,127,.25); }