html{background:#f5f7fb}body{margin:0}#root{min-height:100vh}:root{--navy-0:#03081c;--navy-1:#050b24;--navy-2:#0a1440;--navy-3:#122058;--gold:#f5c542;--gold-soft:#ffe6a8;--gold-deep:#f2a93b;--white:#f4f8ff;--font-title:"Baloo 2", "Fredoka", system-ui, sans-serif;--font-body:"Fredoka", "Baloo 2", system-ui, sans-serif}*{box-sizing:border-box}html,body{background:var(--navy-0);height:100%;margin:0;padding:0;overflow-x:hidden}body{font-family:var(--font-body);color:var(--white);-webkit-font-smoothing:antialiased}.scene{flex-direction:column;width:100%;min-height:100svh;display:flex;position:relative;overflow:hidden}.sky-gradient{z-index:0;background:radial-gradient(120% 90% at 78% 8%, #263a8c8c, transparent 60%), radial-gradient(100% 80% at 15% 100%, #141e5a99, transparent 65%), linear-gradient(180deg, var(--navy-0) 0%, var(--navy-1) 35%, var(--navy-2) 78%, #0d1a4a 100%);animation:.5s ease-out both skyIn;position:absolute;inset:0}.sky-canvas{z-index:1;pointer-events:none;opacity:0;width:100%;height:100%;animation:.8s ease-out .5s forwards starsIn;position:absolute;inset:0}.clouds{z-index:2;filter:blur(6px);pointer-events:none;opacity:0;background:radial-gradient(closest-side,#5a6ec829,#0000 70%);border-radius:50%;width:46vmax;height:18vmax;animation:1s ease-out 1.4s forwards starsIn,90s ease-in-out infinite alternate cloudDrift;position:absolute}.cloud-a{top:52%;left:-8%}.cloud-b{animation-duration:1s,120s;animation-delay:1.6s,0s;top:30%;right:-10%}@keyframes cloudDrift{0%{transform:translate(0)}to{transform:translate(6vmax)}}.stage{z-index:4;flex:1;justify-content:space-between;align-items:center;gap:2rem;width:min(1400px,100%);margin:0 auto;padding:clamp(1.25rem,4vw,4rem);display:flex;position:relative}.title-block{flex:0 46%;min-width:300px}.characters{flex:54%;justify-content:center;align-items:flex-end;min-width:0;display:flex;position:relative}.title{font-family:var(--font-title);letter-spacing:.01em;margin:0;font-weight:800;line-height:1.02}.title-starchamps{color:var(--white);text-shadow:0 0 26px #96b4ff59,0 2px #00000040;font-size:clamp(2.6rem,6.2vw,5.4rem);display:block}.title-ai{color:var(--gold);text-shadow:0 0 30px #f5c54259,0 2px #00000040;font-size:clamp(2.8rem,6.8vw,6rem);display:inline-block;position:relative;overflow:hidden}.title-ai:after{content:"";pointer-events:none;background:linear-gradient(105deg,#0000 40%,#fff8dcbf 50%,#0000 60%);animation:9s ease-in-out 3s infinite titleShimmer;position:absolute;inset:0;transform:translate(-120%)}@keyframes titleShimmer{0%,78%{transform:translate(-120%)}92%,to{transform:translate(120%)}}.tagline{color:#dce8ffd1;text-shadow:0 1px 8px #0006;margin:.9rem 0 1.6rem;font-size:clamp(1rem,1.6vw,1.3rem);font-weight:500}.cta-slot{position:relative}.cta-button{min-height:56px;font-family:var(--font-title);letter-spacing:.12em;color:var(--gold-soft);cursor:pointer;-webkit-backdrop-filter:blur(8px);-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:linear-gradient(#1c2c6ed9,#0a1440e6);border:1.5px solid #f5c542bf;border-radius:999px;align-items:center;gap:.65rem;padding:1rem 2.4rem;font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:700;transition:transform .22s,box-shadow .22s;display:inline-flex;position:relative;box-shadow:0 0 18px #f5c54247,inset 0 1px #ffffff24,0 8px 24px #00000073}.cta-button:hover,.cta-button:focus-visible{outline:none;transform:translateY(-4px);box-shadow:0 0 34px #f5c5428c,inset 0 1px #fff3,0 14px 34px #00000080}.cta-button:active{transform:translateY(-1px)scale(.98)}.cta-star{color:var(--gold);font-size:.9em}.cta-particles{pointer-events:none;position:absolute;inset:0}.cta-particle{width:var(--size);height:var(--size);margin:calc(var(--size) / -2);background:radial-gradient(circle, #fff3cf, var(--gold) 60%, transparent);animation:ctaSparkle var(--dur) ease-out forwards;border-radius:50%;position:absolute}@keyframes ctaSparkle{0%{transform:rotate(var(--angle)) translateX(0);opacity:1}to{transform:rotate(var(--angle)) translateX(var(--dist));opacity:0}}.enter-transition{z-index:50;pointer-events:none;background:radial-gradient(circle at 50% 55%,#ffe6a8e6,#f5c54273 30%,#0a1440e6 75%);animation:.9s ease-in forwards enterFlash;position:fixed;inset:0}@keyframes enterFlash{0%{opacity:0;filter:blur(10px);transform:scale(.6)}35%{opacity:1}to{opacity:1;filter:blur();background:var(--navy-1);transform:scale(1.6)}}.artwork-background{z-index:1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.artwork-background-img{object-fit:cover;object-position:center;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.landing-cta-wrap{z-index:8;position:absolute;top:58%;left:24%;transform:translate(-50%,-50%)}.floating-characters{z-index:5;pointer-events:none;position:absolute;inset:0;overflow:hidden}.floating-character{-webkit-user-select:none;user-select:none;filter:drop-shadow(0 18px 26px #0000003d);will-change:transform;width:auto;height:56%;position:absolute;bottom:23%}.floating-girl{animation:6.6s ease-in-out infinite characterFloatGirl;left:45%}.floating-boy{animation:7.3s ease-in-out .8s infinite characterFloatBoy;left:62%}.characters-still .floating-character{animation:none}@keyframes characterFloatGirl{0%,to{transform:translateY(0)rotate(-.4deg)}50%{transform:translateY(-10px)rotate(.5deg)}}@keyframes characterFloatBoy{0%,to{transform:translateY(0)rotate(.4deg)}50%{transform:translateY(-8px)rotate(-.45deg)}}@keyframes floatIdle{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.layered-scene{aspect-ratio:16/10;width:100%;max-width:720px;position:relative}.layered-scene .char{-webkit-user-select:none;user-select:none;position:absolute}.layered-scene .girl{width:42%;bottom:6%;left:0}.layered-scene .boy{width:44%;bottom:0;left:36%}.layered-scene .robot{width:26%;bottom:8%;right:0}.layered-scene .robot img{width:100%;display:block}.float-idle{animation:6.5s ease-in-out infinite floatIdle}.layered-scene .boy.float-idle{animation-duration:7.4s;animation-delay:.8s}.layered-scene .robot.float-idle{animation-duration:5.6s;animation-delay:.4s}.blink{animation:.18s ease-in-out blinkSquash}@keyframes blinkSquash{0%,to{transform:scaleY(1)}50%{transform:scaleY(.985)}}.wave{transform-origin:80% 30%;animation:1.4s ease-in-out waveHand}@keyframes waveHand{0%,to{rotate:0deg}20%{rotate:-4deg}40%{rotate:3deg}60%{rotate:-4deg}80%{rotate:2deg}}.robot-antenna-light{aspect-ratio:1;background:radial-gradient(circle,#bfe6ff,#4db2ff 60%,#0000);border-radius:50%;width:8%;animation:2.4s ease-in-out infinite antennaPulse;position:absolute;top:-2%;left:50%}@keyframes antennaPulse{0%,to{opacity:.5;box-shadow:0 0 6px 2px #5ab4ff66}50%{opacity:1;box-shadow:0 0 16px 5px #5ab4ffb3}}.robot-chest-star{aspect-ratio:1;pointer-events:none;background:radial-gradient(circle,#78c8ffe6,#0000 70%);width:22%;animation:4.5s ease-in-out infinite chestGlow;position:absolute;top:52%;left:50%;transform:translate(-50%)}@keyframes chestGlow{0%,to{opacity:.35}50%{opacity:.85}}.rainbow-layer{z-index:3;pointer-events:none;position:absolute;inset:0}.rainbow-shimmer{mix-blend-mode:screen;background:linear-gradient(100deg,#0000 35%,#ffffff29 50%,#0000 65%);height:34%;animation:3.4s ease-in-out forwards rainbowSweep;position:absolute;bottom:8%;left:20%;right:-5%;transform:rotate(-14deg)}@keyframes rainbowSweep{0%{opacity:0;background-position:-60vw 0}20%{opacity:1}to{opacity:0;background-position:60vw 0}}.rainbow-particle{background:radial-gradient(circle, #fff3cf, var(--gold) 60%, transparent);border-radius:50%;width:4px;height:4px;animation:6s ease-in-out infinite rainbowParticle;position:absolute;box-shadow:0 0 6px 1px #f5c54299}@keyframes rainbowParticle{0%,to{opacity:0;transform:translateY(0)}30%{opacity:.9}50%{transform:translateY(-14px)}70%{opacity:.7}}.rainbow-traveler{background:radial-gradient(circle, #fff3cf 20%, var(--gold) 55%, transparent 75%);clip-path:polygon(50% 0%,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0% 50%,37% 37%);offset-path:path("M 60 780 Q 700 480 1450 700");opacity:0;filter:drop-shadow(0 0 6px #f5c542cc);width:14px;height:14px;animation:16s ease-in-out 4s infinite rainbowTravel;position:absolute}@keyframes rainbowTravel{0%,70%{offset-distance:0%;opacity:0}75%{opacity:1}90%{opacity:1}97%,to{offset-distance:100%;opacity:0}}.glow-star{z-index:5;pointer-events:none;filter:drop-shadow(0 0 8px #f5c542a6);animation:5s ease-in-out infinite glowStarPulse;position:absolute}@keyframes glowStarPulse{0%,to{opacity:.75;transform:rotate(0)scale(1)}50%{opacity:1;transform:rotate(14deg)scale(1.12)}}.brand-footer{z-index:4;padding:1rem 1rem calc(1.2rem + env(safe-area-inset-bottom));color:var(--gold);justify-content:center;align-items:center;gap:.6rem;display:flex;position:relative}.brand-star{filter:drop-shadow(0 0 6px #f5c54280);width:30px;height:30px}.landing-brand-name{font-family:var(--font-title);letter-spacing:.32em;font-size:1.05rem;font-weight:700}.brand-tag{letter-spacing:.28em;color:#f5c542bf;margin-left:.4rem;font-size:.62rem}@keyframes skyIn{0%{opacity:0}to{opacity:1}}@keyframes starsIn{0%{opacity:0}to{opacity:1}}.entrance-title{opacity:0;animation:.7s ease-out 1s forwards riseIn}.entrance-characters{opacity:0;animation:.9s ease-out 1.3s forwards riseIn}.entrance-cta{opacity:0;animation:.7s ease-out 2.2s forwards riseIn}.entrance-footer{opacity:0;animation:.8s ease-out 2.4s forwards riseIn}@keyframes riseIn{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media (width<=1024px){.stage{gap:1rem}.landing-cta-wrap{top:59%;left:23%}.floating-character{height:52%;bottom:25%}.floating-girl{left:43%}.floating-boy{left:61%}}@media (width<=760px){.stage{text-align:center;flex-direction:column;justify-content:flex-start;gap:1.2rem;padding-top:clamp(2rem,8vh,4rem)}.title-block{flex:none;order:2;min-width:0}.title,.tagline{display:none}.characters{flex:none;order:1;width:100%}.artwork-background-img{object-position:66% center}.floating-character{height:43%;bottom:30%}.floating-girl{left:29%}.floating-boy{left:54%}.landing-cta-wrap{top:auto;left:50%;bottom:calc(2rem + env(safe-area-inset-bottom));width:min(92%,420px);transform:translate(-50%)}.landing-cta-wrap .cta-button{justify-content:center;width:100%}.layered-scene{max-width:420px}.cta-slot{justify-content:center;display:flex}.brand-footer,.rainbow-traveler{display:none}.clouds{width:80vmax;height:30vmax}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.sky-canvas,.entrance-title,.entrance-characters,.entrance-cta,.entrance-footer,.clouds{opacity:1!important}}.scene.reduced .title-ai:after,.scene.reduced .rainbow-traveler,.scene.reduced .rainbow-particle{display:none}.portal-loading{color:#f5c542;letter-spacing:.08em;background:#071735;place-items:center;min-height:100vh;font:700 1rem/1.4 system-ui,sans-serif;display:grid}