:root{
  color-scheme:dark;
  --bg:#06070b;
  --panel:#0d111b;
  --panel-2:#121827;
  --border:#222a3a;
  --text:#f4f7fb;
  --muted:#9aa5b8;
  --soft:#6d7890;
  --cyan:#5fe3d6;
  --blue:#6ea8ff;
  --pink:#ff6fa9;
  --gold:#ffc773;
  --radius:22px;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 18% 4%,rgba(95,227,214,.18),transparent 28%),radial-gradient(circle at 82% 12%,rgba(110,168,255,.18),transparent 30%),linear-gradient(180deg,#06070b,#080b12 46%,#050609);color:var(--text);line-height:1.6}
a{color:inherit;text-decoration:none}
.container{width:min(1120px,calc(100% - 36px));margin:0 auto}
.nav{position:sticky;top:0;z-index:10;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(6,7,11,.72);backdrop-filter:blur(18px)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:-.02em}
.brand img{width:36px;height:36px;border-radius:12px}
.nav-links{display:flex;gap:18px;color:var(--muted);font-size:14px}
.nav-links a:hover{color:var(--text)}
.hero{padding:78px 0 56px}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:44px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(95,227,214,.28);background:rgba(95,227,214,.08);color:#bffaf3;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:700}
h1{font-size:clamp(42px,7vw,74px);line-height:.94;margin:22px 0 20px;letter-spacing:-.065em}
.lead{font-size:clamp(17px,2vw,21px);color:#bdc7d9;max-width:650px;margin:0 0 30px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border-radius:14px;padding:0 18px;border:1px solid rgba(255,255,255,.12);font-weight:800}
.button.primary{background:linear-gradient(135deg,var(--cyan),var(--blue));color:#041016;border:0;box-shadow:0 18px 60px rgba(95,227,214,.22)}
.button.secondary{background:rgba(255,255,255,.06);color:var(--text)}
.note{color:var(--soft);font-size:13px}
.console{border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(18,24,39,.9),rgba(8,11,18,.95));border-radius:32px;padding:18px;box-shadow:0 32px 90px rgba(0,0,0,.45)}
.console-top{display:flex;gap:8px;margin-bottom:16px}.dot{width:10px;height:10px;border-radius:50%;background:var(--soft)}.dot:nth-child(1){background:var(--pink)}.dot:nth-child(2){background:var(--gold)}.dot:nth-child(3){background:var(--cyan)}
.viz{height:260px;border-radius:22px;background:linear-gradient(180deg,#101827,#0a0f1a);position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.wave{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 14px,rgba(255,255,255,.035) 14px 15px),radial-gradient(circle at 50% 70%,rgba(95,227,214,.28),transparent 36%)}
.bars{position:absolute;inset:auto 24px 24px 24px;height:156px;display:flex;align-items:end;gap:8px}.bar{flex:1;border-radius:999px 999px 8px 8px;background:linear-gradient(180deg,var(--cyan),rgba(110,168,255,.6));opacity:.86;animation:pulse 2.6s ease-in-out infinite}.bar:nth-child(2n){animation-delay:-.7s}.bar:nth-child(3n){animation-delay:-1.3s}@keyframes pulse{0%,100%{height:34%}45%{height:var(--h)}}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.stat{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);border-radius:16px;padding:14px}.stat strong{display:block;font-size:20px}.stat span{color:var(--muted);font-size:12px}
.section{padding:60px 0}.section h2{font-size:clamp(30px,4vw,48px);line-height:1;margin:0 0 14px;letter-spacing:-.05em}.section p.section-lead{color:#b7c0d2;font-size:18px;max-width:760px;margin:0 0 28px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{border:1px solid rgba(255,255,255,.1);background:rgba(15,21,34,.74);border-radius:24px;padding:22px}.card h3{margin:0 0 8px;font-size:19px}.card p{margin:0;color:var(--muted)}
.wide-card{border:1px solid rgba(255,255,255,.1);background:linear-gradient(135deg,rgba(95,227,214,.1),rgba(110,168,255,.06));border-radius:28px;padding:26px;margin-top:18px}

.hero-shot{margin:0;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(18,24,39,.86),rgba(8,11,18,.94));border-radius:32px;padding:12px;box-shadow:0 32px 90px rgba(0,0,0,.45)}
.hero-shot img{display:block;width:100%;height:auto;border-radius:24px;box-shadow:0 18px 54px rgba(0,0,0,.34)}
.hero-shot figcaption{margin:12px 8px 2px;color:var(--soft);font-size:12px}
.screenshots-section{padding-top:32px}
.screenshot-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.screenshot-grid figure{margin:0;border:1px solid rgba(255,255,255,.1);background:rgba(15,21,34,.74);border-radius:24px;padding:10px;box-shadow:0 20px 60px rgba(0,0,0,.28)}
.screenshot-grid img{display:block;width:100%;height:auto;border-radius:18px}
.screenshot-grid figcaption{padding:10px 6px 4px;color:#dce5f5;font-size:13px;font-weight:800}
.footer{border-top:1px solid rgba(255,255,255,.08);padding:34px 0;color:var(--soft);font-size:14px}
.doc{padding:56px 0 84px}.doc article{max-width:850px}.doc h1{font-size:clamp(36px,5vw,58px);line-height:1.02}.doc h2{margin-top:36px}.doc p,.doc li{color:#c3ccdc}.doc code{background:rgba(255,255,255,.08);padding:.16em .42em;border-radius:7px}.doc pre{overflow:auto;border:1px solid rgba(255,255,255,.1);background:#0b101b;border-radius:18px;padding:18px}.doc a{color:#8eece4}.toc{display:grid;gap:10px;margin:24px 0}.toc a{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);border-radius:16px;padding:14px;color:#dce5f5}
@media(max-width:840px){.hero-grid,.cards,.screenshot-grid{grid-template-columns:1fr}.nav-links{display:none}.hero{padding-top:52px}.stat-grid{grid-template-columns:1fr}}