:root{--green:#ccff02;--bg:#080809;--text:#f3f3f5;--muted:#9a9aa2}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}
body{
 min-height:100vh;
 overflow:hidden;
 background-image:
  radial-gradient(circle at 12% 8%,rgba(204,255,2,.10),transparent 32%),
  linear-gradient(rgba(204,255,2,.018) 1px,transparent 1px),
  linear-gradient(90deg,rgba(204,255,2,.018) 1px,transparent 1px);
 background-size:auto,48px 48px,48px 48px;
 font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 -webkit-font-smoothing:antialiased;
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(255,255,255,.02) 4px)}
a{color:inherit;text-decoration:none}
.site-header,.hero{position:relative;z-index:1}
.site-header{display:flex;align-items:center;justify-content:flex-end;height:76px;padding:0 clamp(24px,5vw,82px);border:0}
.login-button{display:inline-flex;flex:0 0 46px;width:46px;height:46px;min-width:46px;min-height:46px;max-width:46px;max-height:46px;align-items:center;justify-content:center;padding:0;border:0;border-radius:5px;background:transparent;transition:transform .16s ease,filter .16s ease}.login-button img{display:block;width:46px;height:46px;border-radius:5px;object-fit:cover}
.login-button:hover{transform:translateY(-1px);filter:brightness(1.08) drop-shadow(0 0 10px rgba(204,255,2,.28))}
.hero{display:grid;grid-template-columns:minmax(340px,.78fr) minmax(520px,1.22fr);height:calc(100vh - 76px);padding:0 clamp(24px,5vw,82px);background:radial-gradient(circle at 73% 50%,rgba(204,255,2,.035),transparent 33%)}
.brand img{border-radius:5px}
.hero-copy{display:flex;flex-direction:column;justify-content:center;max-width:700px;padding:37px 0;padding-top:0!important}
h1{margin:0 0 45px;color:var(--text);font-size:clamp(44px,5.3vw,67px);font-weight:430;line-height:.94;letter-spacing:-.065em}
.hero-copy p{max-width:520px;margin:0;color:var(--muted);font-size:clamp(12px,1.05vw,16px);line-height:1.65}
.orb-stage{position:relative;min-height:0;isolation:isolate}
.orb-stage::before{content:"";position:absolute;left:50%;top:50%;z-index:0;width:min(35vw,390px);aspect-ratio:1.28;border-radius:46% 54% 62% 38%/43% 42% 58% 57%;background:radial-gradient(circle at 34% 28%,rgba(255,255,225,.95) 0 2%,transparent 9%),radial-gradient(circle at 58% 62%,#ccff02 0 8%,#45ff61 28%,#00d99a 58%,rgba(0,255,155,.12) 73%,transparent 75%);filter:drop-shadow(0 0 18px #5cff45) drop-shadow(0 0 48px rgba(0,255,132,.62));opacity:.86;transform:translate(-50%,-50%) rotate(-18deg);animation:liquid-fallback 2.35s cubic-bezier(.62,.02,.28,1) infinite alternate}
.orb-stage::after{content:"";position:absolute;left:50%;top:50%;z-index:0;width:min(43vw,470px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(76,255,70,.18),rgba(0,230,160,.06) 42%,transparent 68%);transform:translate(-50%,-50%);animation:orb-glow 1.55s ease-in-out infinite}
.orb-stage canvas{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%}.fluid-ready .orb-stage::before,.fluid-ready .orb-stage::after{opacity:0;animation:none;transition:opacity .18s ease}
.orb-stage noscript img{position:absolute;left:50%;top:50%;z-index:2;width:150px;transform:translate(-50%,-50%)}
@keyframes liquid-fallback{0%{border-radius:37% 63% 69% 31%/34% 38% 62% 66%;transform:translate(-50%,-50%) rotate(-20deg) skewX(-5deg) scale(.84,.96);filter:drop-shadow(0 0 14px #5cff45) drop-shadow(0 0 38px rgba(0,255,132,.58))}32%{border-radius:67% 33% 39% 61%/61% 29% 71% 39%;transform:translate(-48%,-53%) rotate(14deg) skewY(7deg) scale(1.12,.88)}68%{border-radius:28% 72% 58% 42%/72% 54% 46% 28%;transform:translate(-53%,-47%) rotate(-11deg) skewX(8deg) scale(.91,1.13)}100%{border-radius:62% 38% 31% 69%/43% 72% 28% 57%;transform:translate(-49%,-51%) rotate(22deg) skewY(-6deg) scale(1.08,.9);filter:drop-shadow(0 0 24px #8dff3c) drop-shadow(0 0 68px rgba(0,255,132,.78))}}
@keyframes orb-glow{0%,100%{opacity:.32;transform:translate(-50%,-50%) scale(.86)}50%{opacity:.78;transform:translate(-50%,-50%) scale(1.22)}}
@media(max-width:980px){.hero{grid-template-columns:1fr 1fr}.hero-copy h1{font-size:clamp(40px,7vw,64px)}}
@media(max-width:720px){
 body{overflow:hidden}
 .site-header{height:58px;padding:10px 16px 0}
 .login-button,.login-button img{width:42px;height:42px;min-width:42px;min-height:42px;max-width:42px;max-height:42px}
 .hero{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);height:calc(100svh - 58px);min-height:0;padding:0 16px}
 .hero-copy{align-items:center;justify-content:flex-start;max-width:none;padding:38px 0 0!important;text-align:center}
 .hero-copy h1{margin-bottom:0;font-size:clamp(38px,11.5vw,54px);line-height:1.01;letter-spacing:-.055em}
 .hero-copy p{display:none}
 .orb-stage{min-height:0;height:100%}
}
@media(max-width:420px){
 .hero-copy{padding-top:24px!important}
 .hero-copy h1{font-size:clamp(36px,11vw,48px)}
}
/* v0.19.7.2 faster brand-green fallback */
.orb-stage::before{
 background:
  radial-gradient(circle at 34% 28%,color-mix(in srgb,var(--green) 42%,white) 0 2%,transparent 9%),
  radial-gradient(circle at 58% 62%,var(--green) 0 9%,color-mix(in srgb,var(--green) 78%,black) 34%,color-mix(in srgb,var(--green) 42%,transparent) 62%,transparent 76%);
 filter:drop-shadow(0 0 18px var(--green)) drop-shadow(0 0 52px color-mix(in srgb,var(--green) 58%,transparent));
 animation-duration:.92s;
 animation-timing-function:cubic-bezier(.68,-.08,.22,1.08);
}
.orb-stage::after{
 background:radial-gradient(circle,color-mix(in srgb,var(--green) 22%,transparent),color-mix(in srgb,var(--green) 7%,transparent) 42%,transparent 68%);
 animation-duration:.68s;
}
@media(prefers-reduced-motion:reduce){.orb-stage canvas{opacity:1}}