*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:#090a10;color:#f8f7ff;font:16px/1.6 system-ui,sans-serif}a{color:inherit}header,footer{border-block-end:1px solid #292737;background:#0c0d14}nav,.wrap,footer>div{width:min(1200px,calc(100% - 40px));margin:auto}nav,footer>div,.actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}nav,footer>div{padding:16px 0}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:800;margin-right:auto}.brand img{width:40px;border-radius:8px}nav a,footer a,.btn{text-decoration:none}nav a:hover,footer a:hover{color:#bfff00}.hero{position:relative;isolation:isolate;overflow:hidden;border-bottom:1px solid #342548}.hero:before{content:"";position:absolute;inset:-25%;z-index:-2;background:radial-gradient(ellipse at 70% 45%,#7029ad9c,transparent 36%),radial-gradient(ellipse at 65% 66%,#2c288c82,transparent 46%);animation:drift 15s ease-in-out infinite alternate}.stars{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle,#dacaff 1px,transparent 1.6px),radial-gradient(circle,#bc8dfc 1px,transparent 1.8px);background-size:137px 97px,203px 149px;background-position:19px 31px,67px 74px;opacity:.35;animation:twinkle 6s ease-in-out infinite alternate}.wave{position:absolute;bottom:0;left:0;width:100%;height:105px;z-index:-1;filter:drop-shadow(0 0 7px #bfff00);animation:wave 8s ease-in-out infinite alternate}.hero .wrap{padding:85px 0 95px}.split,.grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center}.split{grid-template-columns:.85fr 1.15fr}h1,h2,h3,p{margin:0 0 14px}h1{font-size:clamp(3rem,6vw,5.7rem);letter-spacing:-.065em;line-height:1.02}h2{font-size:clamp(2rem,4vw,3rem);line-height:1.1;letter-spacing:-.04em}h3{font-size:1.4rem}p{color:#c9c6d7}.eyebrow,strong.accent{color:#bfff00}.eyebrow{font-size:.78rem;letter-spacing:.15em;font-weight:800;text-transform:uppercase}.btn{display:inline-block;border:1px solid #6c667f;border-radius:9px;padding:10px 16px;font-weight:700}.primary{background:#bfff00;border-color:#bfff00;color:#101400}.btn:hover{filter:brightness(1.15)}:focus-visible{outline:2px solid #e9bbff;outline-offset:4px}.product{width:100%;height:auto;display:block;border-radius:13px;border:1px solid #64507a;box-shadow:0 15px 55px #8b38cd40}.section{padding:55px 0}.card,.strip{background:linear-gradient(150deg,#1c1729,#11121c);border:1px solid #473359;border-radius:16px;padding:24px}.grid{align-items:stretch}.card .product{margin:20px 0}.strip{margin-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px}.caption{font-size:.8rem;margin-top:8px}.narrow{max-width:720px}.section details{border-bottom:1px solid #363244;padding:14px 0}.section summary{cursor:pointer}footer{border-block:1px solid #292737}footer>div{justify-content:space-between}@keyframes drift{to{transform:translate(6%,-4%) scale(1.14)}}@keyframes twinkle{to{opacity:.58}}@keyframes wave{to{transform:translateY(13px) scaleX(1.06)}}@media(max-width:740px){.split,.grid{grid-template-columns:1fr}.hero .wrap{padding:48px 0 65px}nav .brand{width:100%}nav{gap:12px}.section{padding:38px 0}}@media(prefers-reduced-motion:reduce){*,*::before{animation:none!important}}

/* Pointer offsets layer over the ambient animation. */
.hero::before{translate:calc(var(--cosmic-x,0)*24px) calc(var(--cosmic-y,0)*18px);transition:translate .5s ease-out}
.stars{translate:calc(var(--cosmic-x,0)*12px) calc(var(--cosmic-y,0)*9px);inset:-18px;transition:translate .35s ease-out}
.wave{translate:calc(var(--cosmic-x,0)*10px) calc(var(--cosmic-y,0)*9px);scale:1.025 1;transition:translate .35s ease-out}
.cosmic-glow{position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:0;transition:opacity .35s;background:radial-gradient(ellipse 260px 190px at var(--glow-x,50%) var(--glow-y,50%),#884bdf69,transparent)}
.hero[data-cosmic-active] .cosmic-glow{opacity:1}
@media(prefers-reduced-motion:reduce){.hero::before,.stars,.wave{translate:none;transition:none}.cosmic-glow{display:none}}
.cosmic-space{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.hero[data-space]::before,.hero[data-space] .stars{visibility:hidden}
.hero[data-space] .wave{opacity:.42}

.reference-home{background:#08090f}
.reference-home nav{width:min(1360px,calc(100% - 64px));gap:clamp(16px,3.5vw,42px);padding:14px 0}
.reference-home .brand{font-size:clamp(1rem,2.25vw,1.55rem);gap:12px;white-space:nowrap}
.reference-home .brand img{width:60px}
.reference-home nav>.btn{border-color:#bfff00;padding:6px 20px}
.reference-home .hero .wrap{width:min(1380px,calc(100% - 54px));padding:40px 0;grid-template-columns:38% minmax(0,1fr);gap:12px}
.reference-home h1{font-size:clamp(2.6rem,5.9vw,5.5rem);letter-spacing:-.045em;line-height:1.02}
.reference-home .hero p{color:#f5f2fa;font-size:clamp(1rem,1.75vw,1.35rem);margin:18px 0 32px}
.reference-home .actions{gap:12px}
.reference-home .btn{border-radius:11px}
.reference-home .btn:not(.primary){border-color:#f1edf8}
.reference-home nav .btn:not(.primary){border-color:#bfff00}
.reference-home .hero .product{border:0;box-shadow:0 0 70px #a051ec4d}
.reference-home .wave{opacity:.95;height:115px}
.reference-home .section{width:min(1380px,calc(100% - 46px));padding:34px 0 30px}
.reference-home h2:before{content:"";display:inline-block;background:#bfff00;width:30px;height:4px;border-radius:8px;vertical-align:middle;margin-right:18px}
.reference-home h2{margin:0 0 26px}
.reference-home .grid{gap:20px}
.reference-home .card{padding:18px 30px 22px;border-color:#6a4a88;background:radial-gradient(ellipse at 50% 72%,#251737,#11121b 75%);box-shadow:0 -12px 28px -22px #bf6fff}
.reference-home h3{display:flex;align-items:center;gap:10px;font-size:clamp(1.3rem,2.4vw,2rem);margin:0}
.reference-home h3 img{width:42px;border-radius:8px}
.reference-home .platform{font-size:1.2rem;color:#f8f7ff;margin:2px 0 8px}
.reference-home .device{display:block;width:100%;height:auto;aspect-ratio:1.72;object-fit:contain;border-radius:8px;margin-bottom:9px}
.reference-home .strip{margin-top:30px;padding:22px 5%;gap:16px;font-weight:700}
.reference-home .strip span{display:flex;align-items:center;gap:12px}
.reference-home .strip i{font-style:normal;border:1px solid #4d445b;border-radius:10px;color:#bfff00;font-size:1.5rem;text-align:center;min-width:44px}
.reference-home footer strong{margin-right:auto}
@media(max-width:840px){.reference-home .hero .wrap{grid-template-columns:1fr;gap:26px}.reference-home .hero h1{font-size:clamp(2.6rem,8vw,4.5rem)}}
@media(max-width:740px){.reference-home nav{gap:12px;width:calc(100% - 32px)}.reference-home .brand img{width:42px}.reference-home .card{padding:18px}.reference-home .strip{display:grid;grid-template-columns:1fr 1fr}}
.nebula-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;pointer-events:none;opacity:.85;scale:1.08;translate:calc(var(--cosmic-x,0)*16px) calc(var(--cosmic-y,0)*12px);transition:translate .5s ease-out}
.reference-home .hero::before{z-index:-1;background:linear-gradient(90deg,#08090fe8,transparent 66%);animation:none;translate:none}
@media(prefers-reduced-motion:reduce){.nebula-video{display:none}.reference-home .hero{background:#08090f url('/assets/nebula-poster.webp') center/cover}}
.reference-home .hero[data-space]::before{visibility:visible;background:linear-gradient(90deg,#08090fc9,transparent 59%)}
.reference-home .cosmic-space{z-index:-2;mix-blend-mode:screen;opacity:.92}
.reference-home .nebula-video{opacity:.92}
.flight{display:none}
.skip-flight{position:absolute;z-index:4;top:6px;left:12px;padding:8px 14px;background:#bfff00;color:#111;transform:translateY(-150%)}
.skip-flight:focus{transform:none}
.flight-enabled .cosmic-journey{min-height:230vh}
.flight-enabled .cosmic-journey .hero{position:sticky;top:0;min-height:100vh;display:grid;align-items:center}
.flight-enabled .flight{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;opacity:var(--flight,0)}
.flight-enabled .hero .wrap{transform:perspective(900px) translateZ(var(--retreat,0px));opacity:var(--hero-visibility,1)}
.flight-enabled .hero .wrap:focus-within{transform:none;opacity:1}
.flight-enabled .hero .wave{opacity:var(--hero-visibility,1)}
@media(max-width:840px){.flight-enabled .cosmic-journey{min-height:195vh}.flight-enabled .cosmic-journey .hero{min-height:85vh}}
@media(prefers-reduced-motion:reduce){.flight-enabled .cosmic-journey{min-height:0}.flight-enabled .cosmic-journey .hero{position:relative;min-height:0}.flight-enabled .hero .wrap{transform:none;opacity:1}.flight-enabled .flight{display:none}}

#platforms{position:relative;isolation:isolate}
#platforms::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 25% 40%,#6730ab38,transparent 38%),radial-gradient(ellipse at 76% 42%,#8242bd42,transparent 38%),radial-gradient(circle,#d7bdff 1px,transparent 1.4px) 25px 17px/109px 79px;mask-image:linear-gradient(transparent,#000 16%,#000 76%,transparent)}
.space-device{text-align:center;padding:12px 0 24px}
.space-device h3{justify-content:center}
.device-float{position:relative;isolation:isolate;margin:0 auto 15px;max-width:550px}
.device-float::before{content:"";position:absolute;inset:65% 10% 0;z-index:-1;background:radial-gradient(ellipse,#a35df682,transparent 69%);animation:drift 7s ease-in-out infinite alternate}
.reference-home .space-device .device{margin:0;mask-image:radial-gradient(ellipse 68% 71% at 50% 48%,#000 58%,transparent 94%)}
.space-device .platform{margin-bottom:15px}
.flight-enabled .space-device .device-float{transform:perspective(850px) translateZ(calc(var(--arrival,0)*-240px)) translateY(calc(var(--arrival,0)*22px))}
.flight-enabled .space-device:nth-child(2) .device-float{transform:perspective(850px) translateZ(calc(var(--arrival,0)*-360px)) translateY(calc(var(--arrival,0)*32px))}
@media(prefers-reduced-motion:reduce){.flight-enabled .space-device .device-float{transform:none}}
.flight-enabled .cosmic-journey{min-height:280vh}
.flight-enabled .hero .cosmic-space,.flight-enabled .hero .nebula-video{opacity:calc(.92 - var(--galaxy-arrival,0)*.76)}
.flight-enabled #platforms{background:radial-gradient(ellipse at 74% 3%,#35246d75,transparent 56%)}
.flight-enabled #platforms h2{translate:0 calc(var(--arrival,0)*18px);opacity:calc(1 - var(--arrival,0)*.68)}
.flight-enabled #platforms h2:focus-within{opacity:1}
@media(max-width:840px){.flight-enabled .cosmic-journey{min-height:230vh}}
@media(prefers-reduced-motion:reduce){.flight-enabled .cosmic-journey{min-height:0}}
.reference-home .hero #platforms{margin:0 auto}
.flight-enabled .hero{grid-template-columns:minmax(0,1fr)}
.flight-enabled .hero>.wrap,.flight-enabled .hero>#platforms{grid-area:1/1}
.flight-enabled .hero>#platforms{align-self:center;opacity:var(--reveal,0);transform:perspective(1000px) translateZ(calc(var(--arrival,1)*-640px)) translateX(calc(var(--arrival,1)*20vw));pointer-events:auto;background:none}
.flight-enabled .hero>#platforms[inert]{pointer-events:none}
.flight-enabled .hero>#platforms h2{opacity:1;translate:none}
@media(max-width:740px){.flight-enabled .hero>#platforms .space-devices{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.flight-enabled .hero>#platforms .strip{display:none}.flight-enabled .hero>#platforms .btn{padding:7px;font-size:.82rem}}

/* Trace the device silhouettes so the live scene shows around the artwork. */
.reference-home .space-device .device{mask-image:none}
.reference-home .space-device .device[src$="reference-laptop.webp"]{
  clip-path:polygon(16% 8%,16.5% 5.5%,18% 3.6%,87.5% 3.6%,89.1% 5%,90% 8%,90% 83%,97.2% 89%,97.2% 92%,95% 93%,9% 93%,7% 92%,7% 89%,16% 83%);
}
.reference-home .space-device .device[src$="reference-phone.webp"]{
  clip-path:inset(9.5% 3.1% 14.6% 5.6% round 8% / 14%);
}

.flight-enabled #platforms .space-device .device-float{
  --entry-x:-48px;
  transform:perspective(850px) translateZ(calc(var(--arrival,1)*-240px)) translateX(calc(var(--arrival,1)*var(--entry-x)));
  filter:drop-shadow(0 0 calc(4px + var(--rim,0)*18px) rgb(191 117 255 / var(--rim,0)));
}
.flight-enabled #platforms .space-device:nth-child(2) .device-float{
  --entry-x:48px;
  transform:perspective(850px) translateZ(calc(var(--arrival,1)*-175px)) translateX(calc(var(--arrival,1)*var(--entry-x)));
}
.flight-enabled #platforms .device{filter:brightness(calc(.20 + var(--screen,0)*.80))}
.flight-enabled #platforms .device-float::after{
  content:"";position:absolute;inset:11% 13% 22%;pointer-events:none;
  background:linear-gradient(105deg,transparent 38%,#caff0060 48%,#ecffa8b0 50%,transparent 58%);
  background-size:240% 100%;background-position:calc((1 - var(--pulse,0))*100%) 0;
  opacity:var(--pulse-light,0);mix-blend-mode:screen;
}
.flight-enabled #platforms h2,.flight-enabled #platforms .space-device h3,
.flight-enabled #platforms .space-device .platform,.flight-enabled #platforms .space-device .btn,
.flight-enabled #platforms .strip{opacity:var(--labels,0)}

.flight-enabled .hero>#platforms h2{opacity:var(--labels,0)}
.flight-enabled #platforms .device-float::after{background-repeat:no-repeat}

.cosmic-stop{position:relative;isolation:isolate;overflow:hidden;display:grid;align-items:center;min-height:70vh;padding:clamp(48px,8vw,100px) 0;text-align:center;border-top:1px solid #342548}
.cosmic-stop::before{content:"";position:absolute;inset:-8%;z-index:-1;background:radial-gradient(ellipse at var(--orbit-x,50%) 48%,var(--orbit-color),transparent 62%),url('/assets/nebula-poster.webp') center/cover;opacity:.58;transform:scale(calc(1.03 + var(--stop-depth,0)*.10))}
.studio-stop{--orbit-x:28%;--orbit-color:#323987}
.launch-stop{--orbit-x:72%;--orbit-color:#69449e;min-height:56vh}
.cosmic-stop .product{width:min(100%,720px);margin:24px auto 0}
.cosmic-stop .actions{justify-content:center}
.cosmic-stop .strip{max-width:900px;margin-inline:auto}
.flight-enabled .cosmic-stop .stop-content{opacity:calc(.24 + var(--stop-depth,1)*.76);transform:perspective(950px) translateZ(calc((1 - var(--stop-depth,1))*-250px)) translateY(calc((1 - var(--stop-depth,1))*38px))}
.flight-enabled .cosmic-stop .stop-content:focus-within{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.cosmic-stop{min-height:0}.cosmic-stop::before,.flight-enabled .cosmic-stop .stop-content{transform:none;opacity:1}}
.login-hero{min-height:calc(100svh - 150px);display:grid;place-items:center}
.login-hero .login-wrap{padding:52px 0}
.login-panel{width:min(100%,480px);margin:auto;padding:clamp(24px,5vw,46px);border:1px solid #7952a3;border-radius:20px;background:#10101af2;box-shadow:0 0 72px #773cba4d;text-align:center}
.login-home{display:block;text-align:left;font-size:.9rem;color:#d7c9ed;margin-bottom:22px}
.login-logo{border-radius:14px;display:block;margin:0 auto 18px}
.login-panel h1{font-size:clamp(2.4rem,6vw,3.65rem);margin-bottom:16px}
.login-panel .primary{margin-top:12px}
.login-help{margin:18px 0 0}
@media(prefers-reduced-motion:reduce){.login-hero{background:#08090f url('/assets/nebula-poster.webp') center/cover}}

.dashboard-hero{min-height:75vh;background:#090a10 url('/assets/nebula-poster.webp') center top/cover no-repeat}
.dashboard-hero .wrap{padding:clamp(42px,7vw,92px) 0}
.dashboard-hero h1{font-size:clamp(2.7rem,6vw,5rem)}
.dashboard-note{max-width:60ch;margin-bottom:30px}
.dashboard-grid .card{background:linear-gradient(145deg,#20172cf5,#10111bf5);border-color:#69468b}
.dashboard-grid h2{font-size:clamp(1.5rem,3vw,2.2rem)}
.dashboard-grid .actions{gap:10px}
.dashboard-hero .global-account{display:grid;grid-template-columns:210px minmax(0,1fr);gap:clamp(18px,4vw,56px);padding:clamp(28px,6vw,76px) 0}
.account-nav{display:flex;align-items:stretch;flex-direction:column;gap:6px;width:100%;margin:0;padding:16px 0;align-self:start}
.account-nav strong{color:#bfff00;font-size:.78rem;letter-spacing:.12em;padding:0 12px 8px}
.account-nav a{padding:8px 12px;border-radius:8px;background:#161322}
.account-content .card{margin-top:18px;background:#141222f2;border-color:#69468b}
.account-content h2{font-size:clamp(1.55rem,3vw,2.2rem)}
@media(max-width:700px){.dashboard-hero .global-account{grid-template-columns:1fr}.account-nav{flex-direction:row;flex-wrap:wrap}.account-nav strong{width:100%}}
[hidden]{display:none!important}
#global-sign-in label{display:block;text-align:left;margin:12px 0}
#global-sign-in input{display:block;width:100%;margin-top:5px;padding:12px;border:1px solid #7952a3;border-radius:8px;background:#10101a;color:white;font:inherit}
#global-sign-in button,#global-sign-out{cursor:pointer;font:inherit}