:root{
  color-scheme:light dark;
  --bg:#0B1729;--bg2:#10233D;--line:#22395B;--grid:#1A3150;
  --ink:#F1F5FA;--mute:#A9BCD6;--amber:#FFB547;--amber-ink:#FFB547;--on-amber:#0B1729;
  --panel:radial-gradient(120% 70% at 50% 0%,#132D52 0%,#0B1729 70%);
}
@media (prefers-color-scheme:light){
  :root{
    --bg:#F3F6FA;--bg2:#FFFFFF;--line:#CBD7E6;--grid:#DCE5F0;
    --ink:#0B1729;--mute:#44597A;--amber:#FFB547;--amber-ink:#8A5300;--on-amber:#0B1729;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font:400 17px/1.5 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  overflow-x:hidden}
.wrap{max-width:960px;margin:0 auto;padding:0 16px}
a{color:var(--amber-ink);font-weight:600;text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}
header.top{display:flex;align-items:center;gap:10px;padding:16px 0;font-weight:800;letter-spacing:.2px}
header.top a{color:inherit;text-decoration:none;display:flex;align-items:center;gap:10px}
header.top svg{width:28px;height:28px;flex:none}
/* hero chart stays night-ops in both schemes: it is the app's look */
.hero{border-radius:20px;overflow:hidden;background:var(--panel);border:1px solid #22395B;color:#F1F5FA}
.hero svg.map{display:block;width:100%;height:auto}
.hero .copy{padding:4px 20px 24px}
h1{font-size:clamp(36px,9vw,64px);line-height:1.02;font-weight:800;letter-spacing:-1px;margin:0 0 10px}
.tag{font-size:clamp(18px,4.5vw,22px);color:#C9D6E8;margin:0 0 16px;font-weight:500}
.soon{display:inline-block;background:#FFB547;color:#0B1729;font-weight:800;border-radius:999px;padding:6px 14px;font-size:15px;box-shadow:0 4px 0 #B5781F}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0 8px;padding:0;list-style:none}
.stats li{background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:14px 16px}
.stats b{display:block;font-size:44px;line-height:1;font-weight:800;color:var(--amber-ink);font-variant-numeric:tabular-nums;letter-spacing:-1px}
.stats b.w{font-size:clamp(28px,8vw,44px);line-height:44px}
.stats span{color:var(--mute);font-weight:600;font-size:15px}
.line{font-weight:700;font-size:19px;margin:12px 0 28px}
h2{font-size:22px;font-weight:800;margin:0 0 12px}
.feat{list-style:none;padding:0;margin:0 0 32px;display:grid;gap:12px}
.feat li{display:flex;gap:12px;align-items:flex-start;background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:14px 16px;font-weight:600}
.feat svg{flex:none;width:22px;height:22px;margin-top:2px}
.contact{margin:0 0 32px}
.contact p{margin:0;color:var(--mute)}
footer{border-top:1px solid var(--line);padding:20px 0 32px;color:var(--mute);font-size:15px;display:flex;flex-wrap:wrap;gap:8px 20px}
.doc{max-width:680px}
.doc h1{font-size:clamp(30px,7vw,44px);margin-top:8px}
.doc h2{font-size:19px;margin-top:28px}
.doc p,.doc li{color:var(--ink)}
.doc .meta{color:var(--mute);font-weight:600}
@media (min-width:720px){
  .stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hero .copy{padding:4px 32px 32px}
  .feat{grid-template-columns:repeat(3,1fr)}
}
