:root {
  color-scheme: dark;
  font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
  color: #e9eee8;
  background: #0b100e;
}

* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(760px, calc(100% - 40px)); margin: 0 auto; padding: 12vh 0 48px; }
.mark { color: #73e2a7; font-weight: 700; letter-spacing: .08em; }
h1 { margin: 24px 0; font: 700 clamp(2.5rem, 9vw, 5.6rem)/.96 system-ui, sans-serif; letter-spacing: -.06em; }
.lede { max-width: 650px; color: #b6c1bb; font-size: 1.08rem; line-height: 1.7; }
.downloads { display: flex; flex-wrap: wrap; gap: 12px; margin: 36px 0 72px; }
a { color: #9ee7bf; }
.downloads a { padding: 12px 16px; border: 1px solid #33453c; border-radius: 7px; text-decoration: none; }
.downloads .primary { color: #09110d; background: #73e2a7; border-color: #73e2a7; font-weight: 700; }
h2 { font: 650 1.15rem system-ui, sans-serif; }
pre { overflow-x: auto; padding: 20px; color: #d7e3dc; background: #121a16; border: 1px solid #26352d; border-radius: 7px; line-height: 1.6; }
.small { color: #87958e; font-size: .88rem; line-height: 1.6; }
footer { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 72px; font-size: .82rem; }
@media (max-width: 520px) { main { padding-top: 7vh; } .downloads a { width: 100%; text-align: center; } }
