:root { color-scheme: dark; }
* { box-sizing: border-box; }
body {
  margin: 0; background: #0a0f0d; color: #cbd5e1;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.7; font-size: 16px;
}
a { color: #10b981; text-decoration: none; }
a:hover { text-decoration: underline; }

header.site {
  display: flex; align-items: center; justify-content: space-between;
  max-width: 880px; margin: 0 auto; padding: 16px 24px; border-bottom: 1px solid #14201b;
}
header.site .brand { color: #fff; font-weight: 800; font-size: 18px; letter-spacing: -0.01em; }
header.site nav a { margin-left: 18px; font-size: 14px; color: #94a3b8; }
header.site nav a:hover { color: #10b981; }

.wrap { max-width: 820px; margin: 0 auto; padding: 36px 24px 80px; }
h1 { color: #fff; font-size: 30px; margin: 8px 0 6px; line-height: 1.25; }
h2 { color: #fff; font-size: 21px; margin: 36px 0 10px; }
h3 { color: #e2e8f0; font-size: 17px; margin: 22px 0 6px; }
ul, ol { padding-left: 22px; }
li { margin: 6px 0; }
.lead { font-size: 18px; color: #e2e8f0; }
.muted { color: #64748b; font-size: 14px; }
.card { background: #0e1714; border: 1px solid #14241d; border-radius: 10px; padding: 18px 20px; margin: 18px 0; }
.cta { display: inline-block; background: #10b981; color: #04130d; font-weight: 700; padding: 10px 18px; border-radius: 8px; margin-top: 6px; }
.cta:hover { background: #0ea372; text-decoration: none; }
code { background: #111c18; padding: 1px 6px; border-radius: 4px; font-size: 14px; }

table.ranges { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 14px; }
table.ranges th, table.ranges td { border: 1px solid #1c2b24; padding: 8px 10px; text-align: left; vertical-align: top; }
table.ranges th { background: #0e1714; color: #e2e8f0; }

footer.site {
  max-width: 820px; margin: 48px auto 0; padding: 24px; border-top: 1px solid #14201b;
  color: #64748b; font-size: 14px;
}
footer.site a { color: #64748b; margin-right: 16px; }
footer.site a:hover { color: #10b981; }