:root{
  --bg:#050705;
  --accent:#22E37A;
  --accent-dim:#0F6B3A;
  --amber:#F5B841;
  --text:#F2F4F2;
  --text-2:#D5DBD7;
  --text-3:#A9B3AD;
  --border:rgba(34,227,122,0.15);
  --glass:rgba(34,227,122,0.035);
  --glow-inset:inset 0 0 28px rgba(34,227,122,0.07);
  --sans:'Inter Tight',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:#C9D1CB;text-decoration:none}
a:hover{color:#FFFFFF}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
.wrap{max-width:1280px;margin:0 auto;padding:0 48px}

/* Hero: one viewport tall on desktop */
.hero{position:relative;height:max(720px,min(100svh,960px));overflow:hidden}
.globe{position:absolute;left:0;top:0;z-index:0;display:block;pointer-events:none}
.pills{position:absolute;inset:0;z-index:1;pointer-events:none;margin:0;padding:0;list-style:none}
.hero-content{position:relative;z-index:2}

.topbar{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px}
.brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--text)}
.brand-mark{font-size:26px;line-height:1;font-weight:400}
.brand-name{font-size:17px;font-weight:600;letter-spacing:-0.01em}
.nav{display:flex;align-items:center;gap:6px}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:14px}
.nav .install{padding:0 0 0 6px}
.nav .install span{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:999px;background:var(--accent);color:var(--bg);font-size:13px;font-weight:600}
.nav .install:hover span{background:#4BF094}

.headline{display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;padding-top:40px}
h1{margin:0;font-size:clamp(38px,5.4vw,66px);line-height:1.04;letter-spacing:-0.025em;font-weight:300}
h1 strong{font-weight:700}
.status-pill{margin:0;display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 13px;border-radius:999px;border:1px solid rgba(34,227,122,0.22);background:rgba(34,227,122,0.04);box-shadow:inset 0 0 14px rgba(34,227,122,0.06);font-family:var(--mono);font-size:12.5px;color:#CFD8D2}
.live-dot{width:7px;height:7px;border-radius:999px;background:var(--accent);flex:none;animation:sm-ping 2s ease-out infinite}
@keyframes sm-ping{0%{box-shadow:0 0 0 0 rgba(34,227,122,.6)}70%{box-shadow:0 0 0 7px rgba(34,227,122,0)}100%{box-shadow:0 0 0 0 rgba(34,227,122,0)}}

.row{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;margin-top:64px}
.intro{max-width:360px;font-size:15px;line-height:1.5;color:var(--text-2);display:flex;flex-direction:column;gap:14px}
.intro p{margin:0}
.intro em{font-style:italic;color:var(--text)}
.intro strong{color:var(--accent);font-weight:700}

.glass{border-radius:16px;border:1px solid var(--border);background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--glow-inset)}
.cards{display:flex;gap:12px}
.card{width:172px;height:152px;display:flex;flex-direction:column;justify-content:space-between;padding:16px}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.card-value{font-size:15px;font-weight:700}
.card-label{font-size:13px;line-height:1.35;color:var(--text-3)}

/* Agent pills (positioned by script) */
.agent-pill{position:absolute;left:0;top:0;opacity:0;visibility:hidden;display:flex;align-items:center;gap:10px;padding:7px 15px 7px 7px;border-radius:999px;border:1px solid rgba(34,227,122,0.18);background:rgba(10,18,13,0.66);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 16px rgba(34,227,122,0.08);white-space:nowrap;will-change:transform,opacity;transition:border-color .25s}
.agent-pill.asking{border-color:rgba(34,227,122,0.65)}
.agent-icon{width:28px;height:28px;border-radius:999px;border:1px solid rgba(34,227,122,0.45);display:flex;align-items:center;justify-content:center;color:var(--accent);flex:none}
.agent-name{font-size:15px;font-weight:600}
.agent-status{font-family:var(--mono);font-size:12.5px;color:#BDEFD2}
.agent-status.amber{color:var(--amber)}

/* Below the fold */
.install-strip{border-top:1px solid rgba(34,227,122,0.12);padding:64px 0 56px}
.install-strip h2{margin:0 0 22px;font-size:22px;font-weight:300;letter-spacing:-0.01em}
.install-strip h2 strong{font-weight:700}
.strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.term{padding:20px;min-width:0}
.term-install{display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.mono{font-family:var(--mono)}
.muted{color:var(--text-3)}
.prompt{color:var(--accent)}
.cmd-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cmd{font-family:var(--mono);font-size:15px;color:var(--text);overflow-wrap:anywhere}
.copy-btn{min-height:44px;min-width:76px;padding:0 14px;border-radius:999px;border:1px solid rgba(34,227,122,0.3);background:rgba(34,227,122,0.06);color:var(--accent);font:500 13px var(--sans);cursor:pointer}
.copy-btn:hover{background:rgba(34,227,122,0.14)}
.term-note{margin:0;font-size:14px;line-height:1.5;color:#C3CBC6}
.term-out{font-family:var(--mono);font-size:12.5px;line-height:1.5}
.who-scroll{overflow-x:auto}
.who{display:grid;grid-template-columns:auto auto auto auto minmax(0,1fr);column-gap:22px;row-gap:6px;min-width:520px;color:var(--text-2)}
.ok{color:var(--accent)}
.amber{color:var(--amber)}

footer{border-top:1px solid rgba(34,227,122,0.12)}
.foot{display:flex;align-items:center;flex-wrap:wrap;gap:4px 14px;padding-top:14px;padding-bottom:14px;font-size:13px;color:var(--text-3)}
.foot a{display:inline-flex;align-items:center;min-height:44px}
.foot .brand-small{display:inline-flex;align-items:center;gap:8px;color:var(--text)}

@media (max-width:760px){
  .hero{height:auto;padding-bottom:300px}
  .wrap{padding:0 20px}
  .row{flex-direction:column;gap:24px}
  .cards{width:100%}
  .card{flex:1 1 0;width:auto;height:136px}
  .strip{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .live-dot{animation:none}
  .agent-pill{transition:none}
}
