:root{
  color-scheme:dark;
  --black:#06080d;
  --jet:#0A0A0B;
  --surface:#0D1117;
  --surface2:#121923;
  --blue:#0057FF;
  --cyan:#00D2FF;
  --silver:#C0C6D4;
  --white:#F7FAFF;
  --muted:#8A94A6;
  --line:rgba(192,198,212,.14);
  --radius:28px;
  --display:"Space Grotesk",ui-sans-serif,system-ui,sans-serif;
  --body:"Inter",ui-sans-serif,system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--black)}
body{margin:0;min-height:100vh;min-height:100dvh;background:var(--black);color:var(--white);font-family:var(--body);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
::selection{background:rgba(0,210,255,.28)}
.space{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0;background:
  radial-gradient(circle at 50% -10%,rgba(0,87,255,.17),transparent 42%),
  linear-gradient(180deg,#070a12 0%,#05070b 70%,#070910 100%)}
.stars{position:absolute;inset:0;background-repeat:repeat}
.stars-a{opacity:.42;background-image:
  radial-gradient(circle at 20px 30px,#fff 0 1px,transparent 1.25px),
  radial-gradient(circle at 120px 90px,#00d2ff 0 1px,transparent 1.4px),
  radial-gradient(circle at 180px 170px,#fff 0 .8px,transparent 1.15px);
  background-size:220px 220px}
.stars-b{opacity:.18;background-image:
  radial-gradient(circle at 45px 110px,#fff 0 .8px,transparent 1px),
  radial-gradient(circle at 160px 40px,#4f8cff 0 .9px,transparent 1.2px);
  background-size:260px 260px;animation:drift 42s linear infinite}
.nebula{position:absolute;border-radius:50%;filter:blur(80px);opacity:.23}
.nebula-a{width:42vw;height:42vw;right:-14vw;top:18vh;background:#0057ff}
.nebula-b{width:34vw;height:34vw;left:-10vw;bottom:8vh;background:#00d2ff;opacity:.08}
.grid{position:absolute;left:-15%;right:-15%;bottom:-30vh;height:62vh;transform:perspective(620px) rotateX(67deg);
  transform-origin:center top;background-image:linear-gradient(rgba(0,210,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(0,210,255,.08) 1px,transparent 1px);
  background-size:58px 58px;mask-image:linear-gradient(to bottom,transparent,black 20%,black 75%,transparent)}
.site-shell{position:relative;z-index:1;max-width:1540px;margin:0 auto;padding:env(safe-area-inset-top) 5vw env(safe-area-inset-bottom)}
.site-header{min-height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand img{width:min(330px,44vw);display:block}
.status-chip,.live-badge,.soon-badge,.beta-badge{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(0,210,255,.22);background:rgba(0,210,255,.055);color:#b7f5ff;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.14em;padding:10px 13px}
.status-dot,.live-badge span,.beta-badge span{width:7px;height:7px;border-radius:50%;background:#20d6a2;box-shadow:0 0 12px #20d6a2}
.hero{min-height:0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);align-items:center;gap:4vw;padding:48px 0 40px}
.eyebrow{margin:0 0 18px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.22em}
.hero h1,.section-heading h2,.mission h2{font-family:var(--display);margin:0;line-height:.94;letter-spacing:-.05em}
.hero h1{font-size:clamp(64px,8vw,132px);max-width:880px}
.hero h1 span,.mission h2 span{background:linear-gradient(90deg,#5f8cff,#00d2ff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 42px rgba(0,87,255,.18)}
.hero-lede{font-size:clamp(18px,1.7vw,25px);line-height:1.55;color:#aeb7c6;max-width:700px;margin:24px 0 28px}
.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:58px;padding:0 22px;border:1px solid rgba(0,210,255,.5);border-radius:14px;background:linear-gradient(135deg,rgba(0,87,255,.92),rgba(0,210,255,.68));color:white;font-weight:800;letter-spacing:.02em;box-shadow:0 0 30px rgba(0,87,255,.18);cursor:pointer;transition:.25s ease}
.primary-button:hover{transform:translateY(-2px);box-shadow:0 0 42px rgba(0,87,255,.34)}
.reactor-wrap{position:relative;aspect-ratio:1;max-width:440px;width:100%;margin:auto;display:grid;place-items:center}
.reactor-core{width:37%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(0,210,255,.18),rgba(0,87,255,.08) 46%,rgba(6,8,13,.7) 70%);border:1px solid rgba(0,210,255,.22);box-shadow:0 0 56px rgba(0,87,255,.26),inset 0 0 38px rgba(0,210,255,.08)}
.reactor-core img{width:68%;filter:drop-shadow(0 0 22px rgba(0,210,255,.4))}
.reactor-orbit{position:absolute;border:1px solid rgba(0,210,255,.24);border-radius:50%;inset:10%;animation:spin 24s linear infinite}
.orbit-two{inset:22%;border-color:rgba(0,87,255,.32);transform:rotate(62deg) scaleY(.62);animation-duration:18s;animation-direction:reverse}
.orbit-three{inset:3%;border-style:dashed;border-color:rgba(192,198,212,.15);animation-duration:42s}
.particle{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 18px var(--cyan)}
.p1{top:14%;right:22%}.p2{bottom:17%;left:18%;width:5px;height:5px}.p3{top:49%;right:6%;width:4px;height:4px}
.systems{padding:32px 0 56px}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:28px}
.section-heading h2{font-size:clamp(38px,5vw,72px)}
.section-heading>p{max-width:420px;color:var(--muted);line-height:1.65;margin:0 0 7px}
.system-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
.system-card{position:relative;min-height:0;padding:28px;border:1px solid rgba(192,198,212,.13);border-radius:var(--radius);background:linear-gradient(155deg,rgba(18,25,35,.88),rgba(8,11,17,.78));overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 70px rgba(0,0,0,.24)}
.nexus-card,.pulse-card{transition:.3s ease}
.nexus-card:hover,.pulse-card:hover{transform:translateY(-5px);border-color:rgba(0,210,255,.38);box-shadow:0 30px 80px rgba(0,87,255,.16)}
.card-glow{position:absolute;width:360px;height:360px;border-radius:50%;right:-130px;top:-130px;background:radial-gradient(circle,rgba(0,87,255,.34),transparent 65%);filter:blur(8px)}
.card-topline{position:relative;display:flex;align-items:center;justify-content:space-between;z-index:1}
.card-index{font-family:var(--display);font-size:13px;color:#657081;letter-spacing:.16em}
.soon-badge{color:#b6becb;border-color:rgba(192,198,212,.16);background:rgba(192,198,212,.05)}
.beta-badge{color:#d8f9ff;border-color:rgba(0,210,255,.26);background:rgba(0,210,255,.07)}
.beta-badge span{background:#00d2ff;box-shadow:0 0 12px #00d2ff}
.product-logo{position:relative;width:min(430px,75%);margin:28px 0 8px;z-index:1}
.descriptor{color:var(--cyan);font-size:13px;text-transform:uppercase;font-weight:800;letter-spacing:.14em}
.card-copy{margin:12px 0 20px;max-width:620px;color:#a6afbd;font-size:17px;line-height:1.68}
.card-action{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-weight:800;letter-spacing:.04em}
.card-action .arrow{font-size:24px;color:var(--cyan)}
.card-action.muted{color:#697383;font-weight:600}
.pulse-card{opacity:1}
.pulse-glow{background:radial-gradient(circle,rgba(0,210,255,.28),transparent 65%)}
.mission{padding:64px 0;text-align:center;display:grid;justify-items:center}
.mission-line{height:42px;width:1px;background:linear-gradient(transparent,var(--cyan));margin-bottom:26px}
.mission h2{font-size:clamp(48px,7vw,102px);max-width:1100px}
.mission>p:last-child{max-width:700px;color:var(--muted);font-size:18px;line-height:1.7;margin:24px 0 0}
footer{min-height:110px;border-top:1px solid var(--line);display:grid;grid-template-columns:auto 1fr auto auto;gap:16px 28px;align-items:center;color:#778191;font-size:12px}
footer img{width:52px}
footer div{display:flex;flex-direction:column;gap:4px}footer strong{color:#cdd4df;letter-spacing:.08em}footer div span{color:#687383}
footer p{margin:0}.copyright{white-space:nowrap}
.age-gate{position:fixed;inset:0;z-index:20;display:grid;place-items:start center;overflow-y:auto;padding:max(22px,env(safe-area-inset-top)) 22px max(22px,env(safe-area-inset-bottom));background:rgba(3,5,9,.88);backdrop-filter:blur(20px)}
.age-gate.hidden{display:none}
.gate-card{position:relative;width:min(560px,100%);margin:auto 0;padding:38px;border-radius:26px;border:1px solid rgba(0,210,255,.25);background:linear-gradient(155deg,rgba(18,25,35,.98),rgba(6,8,13,.98));box-shadow:0 30px 90px rgba(0,0,0,.5),0 0 50px rgba(0,87,255,.11)}
.gate-mark{width:74px;margin-bottom:24px}
.gate-card h1{font-family:var(--display);font-size:clamp(34px,6vw,52px);line-height:1.02;letter-spacing:-.04em;margin:0 0 20px}
.gate-copy,.gate-note{color:#a8b1bf;line-height:1.65}
.confirm-row{margin:26px 0;display:flex;gap:14px;align-items:flex-start;padding:16px;border:1px solid rgba(192,198,212,.12);border-radius:14px;background:rgba(255,255,255,.02);cursor:pointer}
.confirm-row input{width:20px;height:20px;accent-color:var(--blue);margin-top:1px;flex:none}
.confirm-row span{font-size:14px;line-height:1.5}
.gate-enter{width:100%;border:0}.gate-enter:disabled{opacity:.35;cursor:not-allowed;transform:none;box-shadow:none}
.gate-note{text-align:center;font-size:11px;margin:15px 0 0}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes drift{to{transform:translate3d(-130px,70px,0)}}
@media(max-width:900px){
  .site-shell{padding:max(10px,env(safe-area-inset-top)) 22px max(18px,env(safe-area-inset-bottom))}.site-header{min-height:76px}.status-chip{display:none}
  .brand img{width:min(300px,72vw)}
  .hero{min-height:auto;grid-template-columns:1fr;padding:28px 0 32px;gap:24px}
  .reactor-wrap{max-width:240px}
  .section-heading{display:block}.section-heading>p{margin-top:18px}
  .system-grid{grid-template-columns:1fr}.system-card{min-height:0}
  footer{grid-template-columns:auto 1fr;padding:20px 0}footer>p,.copyright{grid-column:1/-1}
}
@media(max-width:560px){
  .site-shell{padding:max(10px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom))}.site-header{min-height:76px}
  .brand img{width:245px;max-width:74vw}
  .hero{padding:24px 0 28px}.hero h1{font-size:clamp(56px,18vw,84px)}.hero-lede{font-size:17px;margin:20px 0 24px}
  .primary-button{width:100%}
  .reactor-wrap{width:70%;max-width:210px;margin:0 auto}
  .systems{padding:20px 0 36px}.section-heading{margin-bottom:26px}.section-heading h2{font-size:43px}
  .system-card{padding:22px;min-height:0;border-radius:22px}.product-logo{width:86%;margin-top:24px}.card-copy{font-size:15px}
  .mission{padding:44px 0}.mission h2{font-size:50px}.mission>p:last-child{font-size:16px}
  .gate-card{padding:28px 22px}.gate-mark{width:62px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

.header-actions{display:flex;align-items:center;gap:12px}
.install-button{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(0,210,255,.28);background:rgba(0,210,255,.07);color:#dffbff;border-radius:999px;padding:10px 14px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.install-button:hover{border-color:rgba(0,210,255,.5);background:rgba(0,210,255,.11)}
.install-icon{font-size:15px;line-height:1}
.install-sheet{position:fixed;inset:0;z-index:40}
.install-backdrop{position:absolute;inset:0;border:0;background:rgba(3,5,9,.74);backdrop-filter:blur(14px)}
.install-panel{position:absolute;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(620px,calc(100% - 28px));border:1px solid rgba(0,210,255,.24);border-radius:26px;background:linear-gradient(155deg,rgba(18,25,35,.99),rgba(6,8,13,.99));box-shadow:0 30px 100px rgba(0,0,0,.55),0 0 50px rgba(0,87,255,.12);padding:24px}
.install-panel-head{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:start}
.install-panel-head img{width:64px;border-radius:16px}
.install-panel-head h2{font-family:var(--display);font-size:30px;line-height:1.03;letter-spacing:-.03em;margin:0}
.install-panel-head .eyebrow{margin-bottom:8px}
.icon-button{border:1px solid rgba(192,198,212,.16);background:rgba(255,255,255,.03);color:#cbd3df;width:36px;height:36px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer}
.install-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px}
.install-steps li{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;padding:14px;border:1px solid rgba(192,198,212,.11);background:rgba(255,255,255,.018);border-radius:14px}
.install-steps li>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(0,87,255,.18);color:#dff7ff;font-weight:800}
.install-steps strong{display:block;margin-bottom:4px}
.install-steps p,.generic-install p{margin:0;color:#97a2b1;line-height:1.55;font-size:14px}
.generic-install{margin-top:22px;padding:16px;border:1px solid rgba(192,198,212,.11);border-radius:14px;background:rgba(255,255,255,.018)}
@media(max-width:900px){.header-actions .status-chip{display:none}}
@media(max-width:560px){
  .site-header{gap:10px}.brand img{max-width:64vw}.install-button{padding:9px 11px;font-size:10px;letter-spacing:.08em}
  .install-panel{padding:20px;border-radius:22px}.install-panel-head{grid-template-columns:auto 1fr auto;gap:12px}.install-panel-head img{width:52px}.install-panel-head h2{font-size:25px}
}

/* Blue Reactor v2 — ecosystem identity */
.hero-tagline{margin:0 0 10px;color:var(--cyan);font-family:"Space Grotesk",Inter,sans-serif;font-size:clamp(1rem,2vw,1.3rem);font-weight:700;letter-spacing:.08em}
.product-tagline{position:relative;z-index:1;margin:0 0 4px;color:var(--silver);font-family:"Space Grotesk",Inter,sans-serif;font-size:clamp(1rem,2vw,1.2rem);font-weight:700;letter-spacing:.045em}


/* Mobile viewport / notch hardening */
@supports (height:100dvh){
  .age-gate{min-height:100dvh}
}
@media(max-width:560px){
  .age-gate{align-items:flex-start}
  .gate-card{margin:0}
  .site-header{padding-top:2px}
}


/* Use the reported safe area rather than reserving a status bar in every browser. */
@media(max-width:900px){
  .site-shell{
    padding-top:max(12px,env(safe-area-inset-top));
  }
}
@media(max-width:900px) and (display-mode:standalone){
  .site-shell{
    padding-top:max(12px,calc(env(safe-area-inset-top) + 8px));
  }
}
@media(max-width:560px){
  .site-header{
    min-height:68px;
  }
}


/* Center the access confirmation in normal mobile viewports.
   Short screens fall back to top alignment so the card remains scrollable. */
@media(max-width:560px){
  .age-gate{
    place-items:center;
  }
  .gate-card{
    margin:0;
  }
}
@media(max-width:560px) and (max-height:700px){
  .age-gate{
    place-items:start center;
  }
}


/* Mobile access gate centering v2 — use flex, not grid, for iOS/PWA consistency */
@media(max-width:560px) and (min-height:760px){
  .age-gate{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-height:100dvh;
    height:100dvh;
    overflow-y:auto;
    padding:
      max(20px,env(safe-area-inset-top))
      18px
      max(20px,env(safe-area-inset-bottom));
  }
  .gate-card{
    flex:0 0 auto;
    margin:0;
  }
}

@media(max-width:560px) and (max-height:759px){
  .age-gate{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    min-height:100dvh;
    height:100dvh;
    overflow-y:auto;
    padding:
      max(20px,env(safe-area-inset-top))
      18px
      max(20px,env(safe-area-inset-bottom));
  }
  .gate-card{
    flex:0 0 auto;
    margin:0;
  }
}