:root {
  font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", sans-serif;
  color: #111;
  background: #fff;
  line-height: 1.65;
}

body { margin: 0; }
header, main, footer { width: min(760px, calc(100% - 40px)); margin-inline: auto; }
header { display: flex; gap: 20px; justify-content: space-between; align-items: center; padding-block: 24px; }
nav { display: flex; flex-wrap: wrap; gap: 12px; }
a { color: #065fd4; text-underline-offset: 3px; }
section { padding-block: 28px; border-top: 1px solid #dedede; scroll-margin-top: 24px; }
h1, h2, h3 { line-height: 1.25; letter-spacing: 0; }
.warning { border: 2px solid #d9480f; padding: 18px; }
code { overflow-wrap: anywhere; }
footer { padding-block: 36px; color: #666; }

@media (prefers-color-scheme: dark) {
  :root { color: #f5f5f5; background: #111; }
  section { border-color: #444; }
  a { color: #72a7ff; }
  footer { color: #aaa; }
}