:root{--bg:#0a0d12;--bg2:#10151d;--bg3:#161d28;--fg:#ece8df;--mid:#b6b2a9;--dim:#8a877f;--line:#252d3a;--gold:#c9a24a;--goldfg:#14100a;--ok:#5fb383;--warn:#d9a441;--info:#6a9ec4;--mute:#8a877f}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){--bg:#f6f3ec;--bg2:#ece7db;--bg3:#e3ddcd;--fg:#1a1812;--mid:#4a463c;--dim:#6b665a;--line:#d4cdb9;--gold:#7a5a14;--goldfg:#fbf8f0;--ok:#216b43;--warn:#8a5a0a;--info:#235a85;--mute:#6b665a;color-scheme:light}}
:root[data-theme="light"]{--bg:#f6f3ec;--bg2:#ece7db;--bg3:#e3ddcd;--fg:#1a1812;--mid:#4a463c;--dim:#6b665a;--line:#d4cdb9;--gold:#7a5a14;--goldfg:#fbf8f0;--ok:#216b43;--warn:#8a5a0a;--info:#235a85;--mute:#6b665a;color-scheme:light}
:root{color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.65 "Space Grotesk",system-ui,sans-serif;padding-inline:max(16px,env(safe-area-inset-left,0px)) max(16px,env(safe-area-inset-right,0px));overflow-x:hidden}
a{color:inherit}
.wrap{max-width:62rem;margin-inline:auto;padding-block:2.5rem;min-width:0}
header.top{border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);background:var(--bg);z-index:5}
header.top .in{max-width:62rem;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.8rem}
.brand{font-weight:700;letter-spacing:.04em;text-decoration:none}
.brand i{color:var(--gold);font-style:normal}
nav.main{display:flex;flex-wrap:wrap;gap:.2rem .9rem;font-size:.9rem}
nav.main a{text-decoration:none;color:var(--mid);padding:.25rem 0}
nav.main a:hover,nav.main a[aria-current]{color:var(--fg)}
nav.main a[aria-current]{border-bottom:1px solid var(--gold)}
@media(max-width:700px){header.top .in{flex-direction:column;align-items:flex-start;gap:.3rem}}
h1{font-size:clamp(2rem,6vw,3.6rem);line-height:1.1;margin:.3rem 0 1rem;text-wrap:balance;letter-spacing:-.02em}
h2{font-size:1.5rem;margin:0 0 1rem;text-wrap:balance}
h3{font-size:1.1rem;margin:1.2rem 0 .3rem}
p{margin:0 0 1rem}
.eyebrow{font:500 .78rem/1 "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.14em;color:var(--gold);display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.lede{font-size:1.2rem;color:var(--mid);max-width:42rem}
.prose{max-width:40rem}.prose h3:first-child{margin-top:0}
.note{color:var(--dim);font-size:.92rem}
.hero{padding-block:4.5rem 3rem}
.pagehead{padding-bottom:1rem}
.row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.5rem}
.btn{display:inline-block;background:var(--gold);color:var(--goldfg);padding:.75rem 1.3rem;text-decoration:none;font-weight:600;border:0;cursor:pointer;font:inherit;font-weight:600;border-radius:2px}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid var(--line)}
.btn.off{background:var(--bg3);color:var(--dim);cursor:default}
.split{display:grid;grid-template-columns:12rem minmax(0,1fr);gap:2rem;border-top:1px solid var(--line)}
@media(max-width:700px){.split{grid-template-columns:minmax(0,1fr);gap:.5rem}}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.card{background:var(--bg);padding:1.3rem;text-decoration:none;display:block;min-width:0}
a.card:hover{background:var(--bg2)}
.card h3{margin:0}.card p{color:var(--mid);margin:.5rem 0 0;font-size:.95rem}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem;flex-wrap:wrap}
.tag{font:500 .68rem/1 "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.1em;padding:.3rem .5rem;border:1px solid currentColor;white-space:nowrap}
.t-working{color:var(--ok)}.t-testing{color:var(--warn)}.t-building{color:var(--info)}.t-planned{color:var(--mute)}
.list{display:block;padding-block:1rem}
.row-item{display:grid;grid-template-columns:12rem minmax(0,1fr) auto;gap:1rem;align-items:baseline;padding:1rem 0;border-top:1px solid var(--line);text-decoration:none}
.row-item:last-child{border-bottom:1px solid var(--line)}
a.row-item:hover .ri-name{color:var(--gold)}
.ri-name{font-weight:600}.ri-desc{color:var(--mid)}
@media(max-width:700px){.row-item{grid-template-columns:minmax(0,1fr);gap:.3rem}}
.band{border-top:1px solid var(--line)}
.principles,.steps{padding-left:1.2rem;margin:0}.principles li,.steps li{margin-bottom:.8rem;padding-left:.3rem}
.tablewrap{overflow-x:auto;max-width:100%}
table{border-collapse:collapse;width:100%;min-width:30rem}
th,td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line)}
th{font:500 .78rem "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--dim)}
td:nth-child(2){color:var(--fg)}td:nth-child(3){color:var(--dim)}
.buy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:center;border-top:1px solid var(--line)}
@media(max-width:700px){.buy{grid-template-columns:minmax(0,1fr)}}
.price{font-size:2.6rem;font-weight:700;margin:0 0 .5rem}.price span{font-size:1rem;color:var(--dim);font-weight:400}
.form{display:grid;gap:1rem;max-width:34rem}
.form label{display:grid;gap:.3rem;font-size:.9rem;color:var(--mid)}
.form input,.form select,.form textarea{font:inherit;color:var(--fg);background:var(--bg2);border:1px solid var(--line);padding:.7rem;border-radius:2px;width:100%}
footer{border-top:1px solid var(--line);margin-top:2rem}
footer .in{max-width:62rem;margin:auto;padding-block:2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:var(--dim);font-size:.9rem}
footer a{color:var(--mid)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}