@import"https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600&display=swap";:root{--accent-depth: #10172f;--accent-depth-rgb: 16, 23, 47;--accent-violet: #342058;--accent-violet-rgb: 52, 32, 88;--accent-cyan: #49b8c8;--accent-cyan-rgb: 73, 184, 200;color:#f4f6fb;background:#030405;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;scroll-behavior:smooth;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{background:radial-gradient(circle at 18% 22%,rgba(var(--accent-violet-rgb),.38),transparent 34rem),radial-gradient(circle at 72% 12%,rgba(var(--accent-depth-rgb),.68),transparent 42rem),#030405;margin:0;min-width:320px}button,input,select,textarea{font:inherit}button,.buttonLink{align-items:center;border:1px solid rgba(var(--accent-cyan-rgb),.24);border-radius:999px;cursor:pointer;display:inline-flex;font-weight:700;justify-content:center;min-height:52px;min-width:154px;padding:.92rem 1.35rem;text-decoration:none;transition:border-color .18s ease,box-shadow .18s ease,opacity .18s ease,transform .18s ease}button{background:rgba(var(--accent-depth-rgb),.82);color:#fff}button:hover,.buttonLink:hover{border-color:rgba(var(--accent-cyan-rgb),.72);box-shadow:0 0 0 3px rgba(var(--accent-cyan-rgb),.12);transform:translateY(-1px)}button:focus-visible,.buttonLink:focus-visible,.presetCard:focus-visible{outline:2px solid rgba(var(--accent-cyan-rgb),.72);outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.45;transform:none}a{color:inherit}.appShell{margin:0 auto;max-width:none;overflow:hidden}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}.reveal.isVisible{opacity:1;transform:translateY(0)}.heroSection{align-items:end;display:grid;min-height:86vh;padding:clamp(72px,10vw,140px) clamp(22px,6vw,88px);position:relative;--mode-color: #a0caef;--mode-glow: 6.5;--mode-opacity: .8;--mode-pulse: .7;--mode-turbulence: .16}.heroSection:before{background:linear-gradient(90deg,color-mix(in srgb,var(--mode-color) 88%,#ffffff),rgba(var(--accent-cyan-rgb),.88),#c890b0b8,#e83040ad);bottom:clamp(36px,6vw,72px);content:"";height:1px;left:clamp(22px,6vw,88px);opacity:.62;position:absolute;right:clamp(22px,6vw,88px)}.heroAtmosphere{filter:blur(1px);inset:0;overflow:hidden;pointer-events:none;position:absolute}.heroAtmosphere:before{background-image:radial-gradient(circle,rgba(255,255,255,.62) 0 1px,transparent 1px),radial-gradient(circle,rgba(34,184,232,.68) 0 1px,transparent 1px);background-position:0 0,28px 46px;background-size:96px 96px,142px 142px;content:"";inset:-20%;opacity:.18;position:absolute;transform:rotate(-8deg)}.heroAtmosphere span{animation:orbitGlow 14s ease-in-out infinite alternate;border:1px solid rgba(255,255,255,.09);border-radius:999px;box-shadow:0 0 110px currentColor;opacity:.46;position:absolute}.heroAtmosphere span:nth-child(1){color:color-mix(in srgb,var(--mode-color) 58%,transparent);height:38vw;left:54%;top:12%;width:38vw}.heroAtmosphere span:nth-child(2){animation-delay:-5s;color:color-mix(in srgb,var(--mode-color) 42%,#c890b0);height:26vw;left:68%;top:42%;width:26vw}.heroAtmosphere span:nth-child(3){animation-delay:-9s;color:color-mix(in srgb,var(--mode-color) 36%,#e83040);height:18vw;left:36%;top:36%;width:18vw}.heroAtmosphere span:nth-child(4){animation-delay:-3s;color:rgba(var(--accent-depth-rgb),.78);height:44vw;left:12%;top:8%;width:44vw}@keyframes orbitGlow{0%{transform:translate3d(-2vw,1vw,0) scale(.95)}to{transform:translate3d(2vw,-2vw,0) scale(1.08)}}.heroCopy{max-width:980px;position:relative;z-index:1}.heroMiniSphere{aspect-ratio:1;animation:heroSpherePulse calc(4.4s/max(var(--mode-pulse),.35)) ease-in-out infinite;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,calc(.34 + var(--mode-opacity) * .24)),transparent 14%),repeating-radial-gradient(circle at 52% 50%,color-mix(in srgb,var(--mode-color) 80%,#ffffff) 0 1px,transparent 1px calc(10px - var(--mode-turbulence) * 5px)),radial-gradient(circle at 50% 48%,var(--mode-color),color-mix(in srgb,var(--mode-color) 38%,#05070c) 56%,#030405 76%);border-radius:999px;box-shadow:0 0 calc(var(--mode-glow) * 13px) color-mix(in srgb,var(--mode-color) 46%,transparent),0 0 calc(var(--mode-glow) * 24px) color-mix(in srgb,var(--mode-color) 22%,transparent),inset 0 0 82px #ffffff14;filter:saturate(calc(1 + var(--mode-turbulence) * .8)) brightness(calc(.78 + var(--mode-opacity) * .22));height:clamp(260px,38vw,560px);opacity:.72;overflow:hidden;pointer-events:none;position:absolute;right:clamp(-90px,2vw,80px);top:clamp(80px,13vh,160px);width:clamp(260px,38vw,560px);z-index:0}.heroMiniSphere:before,.heroMiniSphere:after{content:"";inset:0;pointer-events:none;position:absolute;z-index:2}.heroMiniSphere:before{background:radial-gradient(circle at 50% 50%,transparent 36%,rgba(3,4,5,.18) 62%,#030405 82%),linear-gradient(90deg,#030405,#03040500 32% 68%,#030405)}.heroMiniSphere:after{box-shadow:inset 0 0 90px #030405,0 0 110px rgba(var(--accent-cyan-rgb),.18),0 0 170px rgba(var(--accent-violet-rgb),.28)}.heroMiniSphere iframe{border:0;height:118%;left:-9%;position:absolute;top:-9%;width:118%}@keyframes heroSpherePulse{0%,to{transform:scale(.97)}50%{transform:scale(calc(1.01 + var(--mode-turbulence) * .08))}}@keyframes heroSphereDrift{0%{transform:rotate(-5deg) scale(.98)}to{transform:rotate(7deg) scale(1.04)}}.eyebrow{color:rgba(var(--accent-cyan-rgb),.78);font-size:.75rem;font-weight:800;letter-spacing:.22em;margin:0 0 16px;text-transform:uppercase}h1,h2{margin:0}h1{color:#fffffff5;font-size:clamp(4.6rem,15vw,13rem);font-weight:800;letter-spacing:-.055em;line-height:.82;max-width:9ch;text-shadow:0 0 44px rgba(34,184,232,.18),0 0 96px rgba(232,48,64,.12)}.heroOneLiner{color:#f4f6fbad;font-size:clamp(1rem,2vw,1.38rem);line-height:1.5;margin:28px 0 0;max-width:560px}.voiceAmbientLine{bottom:clamp(22px,4vw,42px);color:#cae0ebb8;font-family:Sora,Inter,ui-sans-serif,system-ui,sans-serif;font-size:clamp(.92rem,1.25vw,1.08rem);font-weight:400;letter-spacing:.01em;line-height:1.45;left:50%;margin:0;max-width:560px;opacity:.88;pointer-events:none;position:fixed;text-align:center;text-shadow:0 0 28px rgba(var(--accent-cyan-rgb),.2),0 12px 34px rgba(0,0,0,.62);transform:translate(-50%);z-index:28}h2{color:#f8fafc;font-size:clamp(2rem,6vw,5.8rem);font-weight:760;letter-spacing:-.04em;line-height:.95}.buttonRow{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.buttonLink.primary{background:#f4f6fb;color:#030405}.buttonLink.secondary,.textLink{background:rgba(var(--accent-violet-rgb),.42);color:#f4f6fb}.voiceControl{align-items:center;display:flex;flex-direction:column;gap:7px;position:fixed;right:clamp(20px,3.4vw,42px);top:clamp(20px,3.4vw,42px);max-width:560px;width:fit-content;z-index:30}.voiceIconButton{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--mode-color) 22%,transparent),transparent 68%),#f4f6fb09;border:0;border-radius:999px;box-shadow:0 0 26px color-mix(in srgb,var(--mode-color) 14%,transparent),inset 0 0 18px #ffffff09;min-height:64px;min-width:64px;padding:0}.voiceIconButton:hover{box-shadow:0 0 34px color-mix(in srgb,var(--mode-color) 22%,transparent),inset 0 0 22px #ffffff0e}.voiceControl[data-status=listening] .voiceIconButton,.voiceControl[data-status=wake] .voiceIconButton,.voiceControl[data-status=active] .voiceIconButton{animation:micListen 2.4s ease-in-out infinite}.voiceControl[data-status=active] .voiceIconButton,.voiceControl[data-status=wake] .voiceIconButton{animation-duration:1.55s}.micIcon{display:grid;height:34px;place-items:center;position:relative;width:34px}.micIcon span{border:2px solid rgba(244,246,251,.66);border-radius:999px;display:block;height:20px;position:relative;width:14px}.micIcon span:before{border:solid rgba(244,246,251,.48);border-width:0 2px 2px;border-radius:0 0 999px 999px;content:"";height:8px;left:50%;position:absolute;top:14px;transform:translate(-50%);width:22px}.micIcon span:after{background:#f4f6fb7a;bottom:-12px;content:"";height:9px;left:50%;position:absolute;transform:translate(-50%);width:2px}.voiceControl[data-status=off] .micIcon:after,.voiceControl[data-status=error] .micIcon:after,.voiceControl[data-status=unsupported] .micIcon:after{background:#ff6b6b;border-radius:999px;content:"";height:36px;left:50%;opacity:.86;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(-42deg);width:2px}.voiceControl[data-status=listening] .micIcon span,.voiceControl[data-status=wake] .micIcon span,.voiceControl[data-status=active] .micIcon span{border-color:color-mix(in srgb,var(--mode-color) 80%,#ffffff)}.voiceWave{align-items:center;display:flex;gap:3px;height:16px;justify-content:center;opacity:0;transition:opacity .16s ease}.voiceWave span{animation:voiceWaveIdle 1.1s ease-in-out infinite;background:color-mix(in srgb,var(--mode-color) 72%,#ffffff);border-radius:999px;box-shadow:0 0 12px color-mix(in srgb,var(--mode-color) 28%,transparent);display:block;height:5px;width:2px}.voiceWave span:nth-child(2){animation-delay:-.18s}.voiceWave span:nth-child(3){animation-delay:-.35s}.voiceWave span:nth-child(4){animation-delay:-.52s}.voiceWave span:nth-child(5){animation-delay:-.7s}.voiceControl[data-status=listening] .voiceWave,.voiceControl[data-status=wake] .voiceWave,.voiceControl[data-status=active] .voiceWave{opacity:.72}.voiceMiniError{color:#ffb088d1;font-size:.7rem;line-height:1.2;margin:0;max-width:82px;text-align:center}@keyframes micListen{0%,to{box-shadow:0 0 18px color-mix(in srgb,var(--mode-color) 12%,transparent),inset 0 0 18px #ffffff09;transform:scale(1)}50%{box-shadow:0 0 44px color-mix(in srgb,var(--mode-color) 30%,transparent),inset 0 0 26px #ffffff12;transform:scale(1.035)}}@keyframes voiceWaveIdle{0%,to{height:4px;opacity:.42}50%{height:15px;opacity:.9}}.textLink{border:0;border-radius:0;color:#f4f6fb9e;font-size:.9rem;min-height:auto;padding:0;text-decoration:underline;text-decoration-color:#f4f6fb38;text-underline-offset:5px}.prototypeSection{background:#000;min-height:100vh;position:relative}.prototypeStage{background:#000;box-shadow:0 70px 120px #030405f2;height:100vh;margin:0 auto;max-width:none;overflow:hidden;position:relative}.prototypeStage:before,.prototypeStage:after{content:"";left:0;pointer-events:none;position:absolute;right:0;z-index:2}.prototypeStage:before{background:linear-gradient(180deg,#030405,#03040500);height:120px;top:0}.prototypeStage:after{background:linear-gradient(0deg,#030405,#03040500);bottom:0;height:130px}.prototypeFrame{background:#000;border:0;display:block;height:100vh;min-height:620px;width:100%}.exampleList{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.exampleList span{background:#ffffff0e;border-radius:999px;color:#f4f6fb9e;font-size:.9rem;padding:.48rem .74rem}.currentStateBadge{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#05080e94;border-radius:14px;bottom:24px;box-shadow:0 18px 60px #0000005c,inset 0 1px #ffffff0b;display:grid;gap:4px;opacity:0;padding:14px 16px;pointer-events:none;position:fixed;right:24px;transform:translateY(12px);transition:opacity .22s ease,transform .22s ease;z-index:24}.currentStateBadge.visible{opacity:1;transform:translateY(0)}.currentStateBadge span{color:rgba(var(--accent-cyan-rgb),.62);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.currentStateBadge strong{color:#f4f6fbe6;font-size:.95rem}.explainSection,.flowSection,.devNotes{padding:clamp(72px,10vw,128px) clamp(22px,6vw,88px)}.explainGrid{align-items:start;display:grid;gap:clamp(24px,6vw,80px);grid-template-columns:minmax(0,.85fr) minmax(280px,.65fr)}.explainGrid p,.sectionIntro p,.muted,.devNotes p,.previewBox p{color:#f4f6fb9e;font-size:1rem;line-height:1.7}.explainGrid p{font-size:clamp(1.05rem,2vw,1.35rem);margin:0}.flowSection{background:linear-gradient(180deg,rgba(var(--accent-violet-rgb),.18),rgba(var(--accent-depth-rgb),.16) 42%,#ffffff06);border-top:1px solid rgba(var(--accent-cyan-rgb),.2)}.sectionIntro{margin-bottom:36px;max-width:760px}.sectionIntro h2{font-size:clamp(2.5rem,8vw,7rem)}.panel{background:rgba(var(--accent-depth-rgb),.32);border:1px solid rgba(var(--accent-cyan-rgb),.17);border-radius:12px;box-shadow:inset 0 1px #ffffff0b,0 20px 60px rgba(var(--accent-violet-rgb),.12);padding:clamp(20px,3vw,30px)}.contentGrid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr))}.sectionHeader{margin-bottom:18px}.sectionHeader h2{font-size:clamp(1.25rem,2vw,1.7rem);letter-spacing:-.02em;line-height:1.05}.presetGrid{display:grid;gap:10px}.presetCard{background:transparent;border:1px solid rgba(var(--accent-cyan-rgb),.16);border-radius:10px;color:#f4f6fba8;display:grid;gap:8px;padding:14px;text-align:left}.presetCard.selected{border-color:rgba(var(--accent-cyan-rgb),.86);box-shadow:0 0 0 1px rgba(var(--accent-cyan-rgb),.2),0 0 24px rgba(var(--accent-cyan-rgb),.12);color:#fff}.presetTitle{color:#fff;font-size:1rem;font-weight:800}.intensity,.particleStats,.metricGrid small{color:#f4f6fb6b;font-size:.86rem}.swatches{display:flex;gap:6px}.swatches span{border-radius:999px;display:block;height:16px;width:16px}.renderForm,.statusBlock{display:grid;gap:16px}label{color:#f4f6fbb8;display:grid;font-weight:700;gap:8px}textarea,input,select{background:#00000047;border:1px solid rgba(var(--accent-cyan-rgb),.18);border-radius:10px;color:#f4f6fb;padding:.8rem}textarea{min-height:126px;resize:vertical}.formRow{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.statusLine{display:flex;justify-content:space-between}.statusLine span{color:#f4f6fb6b}.statusLine strong{color:#fff;text-transform:capitalize}.progressTrack{background:#ffffff1a;border-radius:999px;height:8px;overflow:hidden}.progressTrack span{background:linear-gradient(90deg,var(--accent-cyan),#c890b0,#e83040);display:block;height:100%}.previewBox{align-items:center;background:#0003;border:1px dashed rgba(var(--accent-cyan-rgb),.22);border-radius:12px;display:grid;gap:18px;justify-items:center;min-height:236px;padding:24px;text-align:center}.previewBox small{color:#f4f6fb6b;overflow-wrap:anywhere}.spherePlaceholder{aspect-ratio:1;--particle-color: #22b8e8;--particle-speed: .18;--particle-size: 4.5;--particle-opacity: .8;--particle-turbulence: .16;--particle-pulse: .7;--particle-glow: 6.5;animation:particlePulse calc(4s/max(var(--particle-pulse),.35)) ease-in-out infinite,particleDrift calc(16s/max(var(--particle-speed),.16)) ease-in-out infinite alternate;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,calc(.42 + var(--particle-opacity) * .36)),transparent calc(10% + var(--particle-size) * 1.1%)),radial-gradient(circle at 62% 58%,color-mix(in srgb,var(--particle-color) 42%,transparent),transparent 18%),repeating-radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--particle-color) 82%,#ffffff) 0 1px,transparent 1px calc(6px + (1 - var(--particle-turbulence)) * 10px)),radial-gradient(circle at 45% 45%,var(--particle-color),color-mix(in srgb,var(--particle-color) 40%,#08090b) 52%,#08090b);border-radius:999px;box-shadow:0 0 calc(var(--particle-glow) * 8px) color-mix(in srgb,var(--particle-color) 45%,transparent),inset 0 0 calc(var(--particle-glow) * 5px) #ffffff14;opacity:min(1,calc(.5 + var(--particle-opacity) * .36));position:relative;width:min(130px,38vw)}.spherePlaceholder:before,.spherePlaceholder:after{border-radius:inherit;content:"";inset:8%;pointer-events:none;position:absolute}.spherePlaceholder:before{background-image:radial-gradient(circle,rgba(255,255,255,.72) 0 calc(var(--particle-size) * .18px),transparent calc(var(--particle-size) * .18px + 1px)),radial-gradient(circle,color-mix(in srgb,var(--particle-color) 82%,#ffffff) 0 1px,transparent 2px);background-position:0 0,12px 18px;background-size:calc(30px - var(--particle-turbulence) * 18px) calc(30px - var(--particle-turbulence) * 18px),calc(44px - var(--particle-speed) * 20px) calc(44px - var(--particle-speed) * 20px);filter:blur(calc((1 - var(--particle-turbulence)) * .7px));opacity:.56}.spherePlaceholder:after{border:1px solid color-mix(in srgb,var(--particle-color) 70%,transparent);box-shadow:inset 0 0 28px color-mix(in srgb,var(--particle-color) 38%,transparent);opacity:.52}.spherePlaceholder.spark:before{animation:particleSpark 1.3s steps(2,end) infinite}.spherePlaceholder.rupture:after{clip-path:polygon(50% 0,58% 35%,100% 48%,58% 57%,48% 100%,41% 58%,0 49%,41% 38%)}.spherePlaceholder.wave:before{filter:blur(1px);opacity:.42}.particleMetricStrip{color:#f4f6fb7a;display:flex;flex-wrap:wrap;font-size:.78rem;gap:8px;justify-content:center}.particleMetricStrip span{border:1px solid rgba(var(--accent-cyan-rgb),.16);border-radius:999px;padding:.28rem .55rem}@keyframes particlePulse{0%,to{transform:scale(.96)}50%{transform:scale(calc(1.02 + var(--particle-turbulence) * .12))}}@keyframes particleDrift{0%{filter:saturate(.88) brightness(.94)}to{filter:saturate(calc(1.02 + var(--particle-turbulence))) brightness(calc(.96 + var(--particle-opacity) * .16))}}@keyframes particleSpark{50%{opacity:.88;transform:rotate(8deg)}}.devNotes{padding-top:40px}.devNotes details{border-top:1px solid rgba(var(--accent-cyan-rgb),.2);color:#f4f6fb9e;margin:0 auto;max-width:1040px;padding-top:24px}.devNotes summary{color:#f4f6fbc7;cursor:pointer;font-weight:800}.devNotes code{color:#fff}.devNotes dl{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}.devNotes dt{color:rgba(var(--accent-cyan-rgb),.58);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}.devNotes dd{margin:6px 0 0;overflow-wrap:anywhere}@media(max-width:1120px){.contentGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.heroSection{min-height:100vh;padding-bottom:430px}.heroMiniSphere{height:320px;opacity:.38;right:-150px;top:90px;width:320px}.prototypeHeader,.explainGrid,.contentGrid,.formRow,.devNotes dl{grid-template-columns:1fr}.prototypeFrame{height:100vh;min-height:560px}button,.buttonLink{width:100%}.voiceControl{right:14px;top:14px}.voiceAmbientLine{bottom:72px;width:min(78vw,420px)}.currentStateBadge{bottom:14px;right:14px}}