@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
:root{--bg:#030706;--green:#a8ffb2;--acid:#53ff78;--silver:#d7e0dc;--muted:#78867e;--mono:'IBM Plex Mono',monospace;--display:'Barlow Condensed',Impact,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:#f1f6f2;font-family:var(--mono);overflow-x:hidden;min-height:100vh}
#matrix{position:fixed;inset:0;width:100%;height:100%;z-index:0;opacity:.30;pointer-events:none}
.noise,.scanlines,.vignette{position:fixed;inset:0;pointer-events:none;z-index:2}.noise{opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.scanlines{opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.35) 4px)}.vignette{background:radial-gradient(ellipse at center,transparent 25%,rgba(0,0,0,.72) 100%)}
.hud,main,footer,.sound-dock{position:relative;z-index:3}.hud{height:76px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(168,255,178,.13);background:rgba(2,7,5,.5);backdrop-filter:blur(12px)}
.brand img{width:108px;height:auto;max-height:35px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(110,255,143,.35))}
.status{display:flex;align-items:center;gap:10px;color:#9bb4a1;font-size:10px;letter-spacing:.15em}.status b{margin-left:18px;color:#e8f1eb;font-weight:500}.pulse{width:6px;height:6px;border-radius:50%;background:var(--acid);box-shadow:0 0 12px var(--acid);animation:pulse 1.2s infinite}.studio{font-size:9px;letter-spacing:.12em;color:#aab7ae;text-decoration:none}.studio i{color:var(--green);font-style:normal}
.hero{min-height:calc(100svh - 76px);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:72px 20px 94px;position:relative;isolation:isolate}
.hero:before{content:"";position:absolute;width:min(68vw,700px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(31,255,96,.12),rgba(0,0,0,0) 68%);filter:blur(15px);z-index:-1}
.eyebrow{display:flex;align-items:center;gap:14px;color:#8da394;font-size:9px;letter-spacing:.22em}.eyebrow .line{height:1px;width:48px;background:linear-gradient(90deg,transparent,var(--acid))}
.hero-mark{width:clamp(135px,20vw,220px);aspect-ratio:1;position:relative;margin:32px 0 20px;display:grid;place-items:center}.lumi-symbol{width:65%;height:65%;object-fit:contain;z-index:2;filter:drop-shadow(0 0 20px rgba(95,255,128,.55));animation:float 5s ease-in-out infinite}
.orbit{position:absolute;inset:3%;border:1px solid rgba(126,255,151,.27);border-radius:50%;transform:rotateX(68deg) rotate(-22deg);box-shadow:0 0 18px rgba(83,255,120,.08)}.orbit-b{inset:13%;transform:rotateX(68deg) rotate(48deg);border-style:dashed;animation:spin 20s linear infinite}.core-glow{position:absolute;inset:22%;border-radius:50%;background:rgba(68,255,105,.13);filter:blur(28px)}
.pretitle{font-size:10px;letter-spacing:.3em;color:#9eafa3;margin:4px 0 7px}.hero h1{font:800 clamp(55px,10vw,128px)/.9 var(--display);letter-spacing:.025em;margin:0;color:#edf4ef;text-shadow:0 0 28px rgba(118,255,146,.12);position:relative}.hero h1 em{font-style:normal;color:var(--green);text-shadow:0 0 28px rgba(83,255,120,.45)}.hero h1.glitch{animation:glitch .45s steps(2) 2}
.subline{font-size:10px;letter-spacing:.42em;color:#8da495;margin:22px 0 34px}.cursor{color:var(--acid);animation:blink .8s steps(1) infinite}
.enter{border:1px solid rgba(151,255,169,.55);color:#eaffed;background:rgba(56,255,101,.07);padding:16px 23px;min-width:250px;display:flex;justify-content:space-between;align-items:center;gap:28px;font:600 10px var(--mono);letter-spacing:.16em;cursor:pointer;transition:.25s;box-shadow:0 0 25px rgba(76,255,110,.06),inset 0 0 20px rgba(76,255,110,.04)}.enter:hover{background:rgba(75,255,109,.18);box-shadow:0 0 35px rgba(76,255,110,.22);transform:translateY(-2px)}.enter b{font-size:16px;color:var(--green)}
.scroll-hint{position:absolute;bottom:28px;color:#6d8173;font-size:8px;letter-spacing:.2em}.scroll-hint span{display:block;color:var(--acid);font-size:18px;margin-top:8px;animation:down 1.5s infinite}
.sequence{padding:130px 10vw 150px;border-top:1px solid rgba(168,255,178,.12);border-bottom:1px solid rgba(168,255,178,.12);background:linear-gradient(180deg,rgba(3,12,7,.82),rgba(3,7,6,.7))}.sequence-grid{max-width:1080px;margin:auto;display:grid;grid-template-columns:1fr 2fr 1.25fr;gap:35px}.seq-label,.micro{font-size:9px;letter-spacing:.22em;color:var(--acid)}.seq-copy h2{font:700 clamp(48px,7vw,86px)/.9 var(--display);margin:18px 0 24px}.seq-copy h2 span{color:var(--green)}.body-copy{font-size:12px;line-height:2;color:#9eafa4;max-width:420px}.telemetry{align-self:center;border:1px solid rgba(168,255,178,.22);background:rgba(3,13,8,.7);padding:18px}.telemetry-head{font-size:9px;letter-spacing:.14em;color:#dce9df;padding-bottom:15px;border-bottom:1px solid rgba(168,255,178,.15)}.telemetry-head span{float:right;color:var(--acid)}.tele-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(168,255,178,.09);font-size:8px;color:#81968a}.tele-row b{color:#c9f9d0;font-weight:500}.wave{height:36px;margin-top:16px;background:repeating-linear-gradient(90deg,transparent 0 4px,rgba(83,255,120,.45) 5px 6px);mask-image:linear-gradient(0deg,transparent,#000 35%,#000 70%,transparent);animation:wave .7s steps(4) infinite}
.reveal{min-height:80vh;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:100px 20px;background:radial-gradient(ellipse at 50% 55%,rgba(61,255,107,.12),transparent 42%)}.wordmark{font:900 clamp(100px,22vw,260px)/.8 var(--display);letter-spacing:.04em;color:#e7f0e9;text-shadow:0 0 24px rgba(90,255,127,.32),0 0 80px rgba(90,255,127,.18);margin:24px 0}.wordmark span{font:400 14px var(--mono);vertical-align:top;color:var(--green)}.reveal-line{font-size:9px;letter-spacing:.35em;color:#93a99a}.launch{margin-top:34px;border-bottom:1px solid var(--acid);padding:14px 2px;color:#e7f4e9;text-decoration:none;font-size:10px;letter-spacing:.2em}.launch span{color:var(--acid);margin-left:22px}
footer{padding:28px 5vw 110px;display:flex;justify-content:space-between;color:#68796d;font-size:8px;letter-spacing:.12em}footer a{color:#9eb1a2;text-decoration:none}
.sound-dock{position:fixed;z-index:5;bottom:0;left:0;right:0;min-height:66px;padding:10px 5vw;display:flex;align-items:center;justify-content:space-between;gap:18px;background:rgba(2,7,5,.88);border-top:1px solid rgba(168,255,178,.2);backdrop-filter:blur(18px)}.track{display:flex;align-items:center;gap:12px}.track b,.track small{display:block}.track b{font-size:9px;letter-spacing:.1em;color:#e7f4e9}.track small{font-size:7px;color:#7d9183;margin-top:5px;letter-spacing:.08em}.equalizer{height:22px;display:flex;align-items:center;gap:3px}.equalizer i{width:2px;height:8px;background:var(--acid);animation:eq .6s ease-in-out infinite alternate}.equalizer i:nth-child(2){height:17px;animation-delay:.2s}.equalizer i:nth-child(3){height:12px;animation-delay:.4s}.equalizer i:nth-child(4){height:19px;animation-delay:.1s}.sound-link,.upload{font:500 8px var(--mono);letter-spacing:.1em;color:#b8c9bc;text-decoration:none;border:1px solid rgba(168,255,178,.22);padding:11px 13px;background:rgba(83,255,120,.04);cursor:pointer}.upload input{display:none}.sound-link:hover,.upload:hover{border-color:var(--acid);color:#fff}
body.initialized .hero-mark{animation:mark-in 1.2s ease both}body.initialized .hero h1{animation:title-in 1s .3s both}body.initialized .hero h1:after{content:attr(data-text);position:absolute;inset:0;color:var(--acid);opacity:.22;transform:translate(3px,-2px);clip-path:inset(45% 0 30% 0);animation:glitch 2.8s infinite}
@keyframes pulse{50%{opacity:.35;box-shadow:0 0 3px var(--acid)}}@keyframes float{50%{transform:translateY(-9px) scale(1.025)}}@keyframes spin{to{transform:rotateX(68deg) rotate(408deg)}}@keyframes blink{50%{opacity:0}}@keyframes down{50%{transform:translateY(7px)}}@keyframes wave{to{background-position:13px 0}}@keyframes eq{to{transform:scaleY(.35)}}@keyframes glitch{0%,92%,100%{transform:translate(0)}93%{transform:translate(3px,-1px)}95%{transform:translate(-3px,2px)}97%{transform:translate(2px,1px)}}@keyframes mark-in{from{opacity:0;transform:scale(.7) rotate(-14deg);filter:blur(12px)}to{opacity:1;transform:scale(1) rotate(0);filter:blur(0)}}@keyframes title-in{from{opacity:0;letter-spacing:.3em;filter:blur(10px)}to{opacity:1;letter-spacing:.025em;filter:blur(0)}}
@media(max-width:760px){.hud{height:62px;padding:0 18px}.brand img{width:82px}.status{font-size:8px;gap:6px}.status b{margin-left:4px}.studio{font-size:7px}.hero{min-height:calc(100svh - 62px);padding:55px 16px 100px}.eyebrow{font-size:7px;gap:8px}.hero h1{font-size:clamp(52px,15vw,82px)}.pretitle{font-size:8px}.subline{font-size:8px;letter-spacing:.25em}.sequence{padding:85px 8vw}.sequence-grid{grid-template-columns:1fr;gap:28px}.seq-label{margin-bottom:0}.telemetry{max-width:400px;width:100%}.reveal{min-height:68vh}.sound-dock{padding:9px 12px;gap:7px;flex-wrap:wrap;min-height:76px}.track{gap:8px}.track b{font-size:8px}.track small{font-size:6px}.sound-link,.upload{font-size:7px;padding:9px 8px}footer{padding:25px 16px 120px;font-size:6px;gap:10px}.scroll-hint{bottom:23px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}