:root { color-scheme: light dark; }
* { box-sizing: border-box; }
body {
  margin: 0; font: 16px/1.65 -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  color: #1a1a1a; background: #fafafa;
}
@media (prefers-color-scheme: dark) {
  body { color: #e6e6e6; background: #0f1115; }
  a { color: #6ea8fe; }
  .card { background: #171a21; border-color: #262b36; }
  header { background: #0b0d11; border-color: #262b36; }
  code { background: #262b36; }
}
a { color: #1a56db; }
header {
  background: #fff; border-bottom: 1px solid #e5e7eb; padding: 18px 24px;
  display: flex; align-items: center; gap: 12px; position: sticky; top: 0;
}
header .brand { font-weight: 800; letter-spacing: .5px; font-size: 18px; }
header nav { margin-left: auto; display: flex; gap: 18px; font-size: 14px; }
main { max-width: 760px; margin: 0 auto; padding: 40px 24px 80px; }
h1 { font-size: 30px; margin: 0 0 6px; }
h2 { font-size: 20px; margin: 34px 0 8px; }
.muted { color: #6b7280; font-size: 14px; }
.card { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 22px 26px; margin-top: 22px; }
code { background: #f0f1f3; padding: 1px 6px; border-radius: 5px; font-size: 14px; }
footer { max-width: 760px; margin: 0 auto; padding: 24px; color: #6b7280; font-size: 13px; border-top: 1px solid #e5e7eb33; }
ul { padding-left: 20px; }
li { margin: 6px 0; }