:root{
  --bg:#0E0E10;
  --bg-elev:#17171A;
  --fg:#F2F2F0;
  --fg-soft:#9A9A9E;
  --fg-faint:#5A5A60;
  --line:rgba(242,242,240,0.08);
  --line-strong:rgba(242,242,240,0.18);
  --accent:#A82941;
  --sans:"Space Grotesk", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, Menlo, monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s}
a:hover{border-bottom-color:var(--accent)}
::selection{background:var(--accent);color:#fff}

/* Variant: Light */
body[data-variant="light"]{--bg:#F2F0EC;--bg-elev:#E8E5DF;--fg:#0A0A0C;--fg-soft:#53535C;--fg-faint:#9A9AA0;--line:rgba(10,10,12,0.08);--line-strong:rgba(10,10,12,0.18)}
/* Variant: Mono (no accent color) */
body[data-variant="mono"]{--accent:#F2F2F0}

.wrap{max-width:1100px;margin:0 auto;padding:0 40px;position:relative}
@media (max-width:720px){.wrap{padding:0 22px}}

nav.top{position:sticky;top:0;z-index:30;background:color-mix(in oklab,var(--bg) 85%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
nav.top .inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:inline-flex;align-items:center;line-height:0;border:0}
.brand-logo{height:34px;width:auto;display:block}
.back{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--fg-soft);border:0}
.back:hover{color:var(--accent)}

.sec-label{display:flex;align-items:center;gap:14px;font-family:var(--mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--fg-soft);padding:64px 0 0}
.sec-label .num{color:var(--accent);font-weight:600}
.sec-label .line{flex:1;height:1px;background:var(--line-strong)}
.sec-label .right{color:var(--fg-faint)}

.doc{padding-bottom:120px}
.doc h1{font-family:var(--sans);font-weight:700;font-size:clamp(44px,7vw,92px);line-height:0.95;letter-spacing:-0.035em;margin:24px 0 28px;text-transform:uppercase;max-width:18ch}
.doc .lede{font-size:19px;line-height:1.55;color:var(--fg-soft);max-width:62ch;margin:0 0 56px;padding-bottom:32px;border-bottom:1px solid var(--line-strong);text-wrap:pretty}
.doc section{padding:28px 0;border-bottom:1px solid var(--line);max-width:72ch}
.doc section:last-of-type{border-bottom:0}
.doc h2{font-family:var(--sans);font-weight:600;font-size:22px;letter-spacing:-0.015em;margin:0 0 14px;text-transform:none;color:var(--fg)}
.doc p{font-size:15.5px;line-height:1.7;color:var(--fg);margin:0 0 12px;text-wrap:pretty}
.doc p b{font-weight:600}
.doc ul{margin:4px 0 12px;padding-left:22px;font-size:15.5px;line-height:1.7}
.doc ul li{margin-bottom:4px;color:var(--fg)}
.doc ul li::marker{color:var(--accent)}
.doc dl{display:grid;grid-template-columns:220px 1fr;gap:10px 24px;margin:12px 0 0;font-size:15px}
.doc dt{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--fg-soft);padding-top:3px}
.doc dd{margin:0;color:var(--fg)}
.doc .meta{font-family:var(--mono);font-size:11px;color:var(--fg-faint);margin-top:40px;text-transform:uppercase;letter-spacing:0.08em}
@media (max-width:560px){.doc dl{grid-template-columns:1fr;gap:4px 0}.doc dt{padding-top:10px}}

footer{border-top:1px solid var(--line-strong);padding:28px 0;margin-top:40px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--fg-soft)}
footer .inner{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
footer .legal{display:flex;gap:20px}
footer a{color:var(--fg-soft);border:0}
footer a:hover{color:var(--accent)}