@import url("/fonts/fonts.css");
:root{
  --bg:#F3F4F6; --surface:#FFFFFF; --line:#E3E6EA; --ink:#111418; --ink2:#2A2F36; --muted:#5B6470;
  --accent:#2457D6; --accent-soft:#EAF0FD; --ok-bg:#E3F4EA; --ok-fg:#1E7F4F;
  --pad:clamp(16px,4vw,40px); --radius:12px;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#0F1115; --surface:#171A20; --line:#262A33; --ink:#ECEEF2; --ink2:#C9CED6; --muted:#9AA3AF;
        --accent:#7FA3F2; --accent-soft:#1E2A44; --ok-bg:#173326; --ok-fg:#7EE2A8;}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 clamp(15px,1.1vw + 12px,17px)/1.55 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
.wrap{max-width:880px;margin:0 auto;padding:0 var(--pad);min-height:100vh;display:flex;flex-direction:column}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:clamp(16px,3vw,28px) 0}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-height:44px}
.mark{width:28px;height:28px;flex:none}
.mark rect{fill:var(--accent)} .mark circle{fill:none;stroke:#fff;stroke-width:3}
.word{font-weight:600;font-size:20px;letter-spacing:-.01em}
.tag,.eyebrow,.n,.status{font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500}
.tag{font-size:12px;color:var(--muted)}
main{flex:1}
.hero{padding:clamp(28px,7vw,72px) 0 clamp(24px,5vw,48px)}
.eyebrow{margin:0 0 14px;font-size:13px;color:var(--accent);letter-spacing:.02em}
h1{margin:0;font-weight:600;font-size:clamp(28px,4.2vw + 12px,48px);line-height:1.12;letter-spacing:-.02em;max-width:18ch}
.lead{margin:clamp(16px,2.5vw,22px) 0 0;color:var(--ink2);max-width:52ch}
.status{display:inline-flex;align-items:center;gap:8px;margin:22px 0 0;padding:6px 12px;border-radius:999px;background:var(--ok-bg);color:var(--ok-fg);font-size:13px}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.inside{border-top:1px solid var(--line);padding:clamp(24px,5vw,44px) 0}
h2{margin:0 0 18px;font-size:13px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.rows{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.rows li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:16px clamp(16px,2.5vw,22px);border-top:1px solid var(--line)}
.rows li:first-child{border-top:0}
.n{font-size:12px;color:var(--muted);padding-top:3px}
.rows b{display:block;font-weight:600}
.rows span:not(.n){display:block;color:var(--ink2);margin-top:2px}
@media (min-width:760px){
  .rows{display:grid;grid-template-columns:1fr 1fr}
  .rows li:nth-child(2){border-top:0}
  .rows li:nth-child(even){border-left:1px solid var(--line)}
}
.note{padding:0 0 clamp(28px,5vw,48px)}
.note p{margin:0;padding:16px clamp(16px,2.5vw,22px);border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:0 var(--radius) var(--radius) 0;color:var(--ink2);max-width:62ch}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;padding:20px 0 28px;border-top:1px solid var(--line);color:var(--muted);font-size:14px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.soon{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,10vh,120px) 0}
.soon h1{font-size:clamp(44px,8vw + 16px,96px);max-width:none;line-height:1}
.soon .lead{font-size:clamp(17px,1vw + 13px,20px)}
.soon .status{align-self:flex-start;background:var(--accent-soft);color:var(--accent)}