:root{color-scheme:dark;--cyan:#66e6ff;--gold:#ffd56b}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow:hidden;background:#020711}body{font-family:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold",system-ui,sans-serif}button{font:inherit;cursor:pointer}.start-screen,.story{position:fixed;inset:0;min-height:100svh;width:100%;background:#06111e;overflow:hidden}.bg,.scene img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.bg{filter:saturate(.9) brightness(.62);animation:zoom 12s ease-in-out infinite alternate}.shade,.vignette{position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,7,17,.12),transparent 45%,rgba(2,7,17,.88))}.start-card{position:absolute;z-index:2;left:50%;bottom:max(4svh,24px);width:min(92vw,470px);transform:translateX(-50%);padding:26px 20px 20px;text-align:center;color:#fff;border:1px solid #ffffff33;border-radius:28px;background:linear-gradient(145deg,#0a233ec9,#030a16dd);backdrop-filter:blur(18px);box-shadow:0 20px 70px #0008}.signal-dot{width:13px;height:13px;margin:0 auto 12px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 7px #66e6ff22,0 0 24px var(--cyan);animation:pulse 1.4s infinite}.eyebrow,.caption small{margin:0 0 8px;color:var(--cyan);font-size:11px;letter-spacing:.18em;font-weight:900}.start-card h1{margin:0;font-size:clamp(34px,9vw,55px);line-height:.98}.gold{color:var(--gold);font-weight:900;letter-spacing:.07em}.languages{display:flex;gap:6px;padding:5px;margin:20px 0 12px;border-radius:16px;background:#0005}.languages button{flex:1;min-height:48px;padding:4px;border:0;border-radius:12px;color:#a9bed1;background:transparent;font-size:12px;line-height:1.05}.languages .selected{color:#05131f;background:var(--cyan);font-weight:900}.primary{width:100%;min-height:56px;border:0;border-radius:17px;color:#06111e;background:linear-gradient(135deg,#fff0a9,#ffc653);font-size:16px;font-weight:900}.start-card>small{display:block;margin-top:11px;color:#90aabd}.scene{position:absolute;inset:0;overflow:hidden}.scene img{animation:ken 13s ease-out both}.vignette{pointer-events:none}header{position:absolute;z-index:5;top:max(16px,env(safe-area-inset-top));left:14px;right:14px;display:flex;align-items:center;gap:10px}.pill,.round{height:40px;border:1px solid #ffffff44;color:#fff;background:#030a1688;backdrop-filter:blur(12px)}.pill{min-width:62px;padding:0 10px;border-radius:999px;font-size:11px;font-weight:900}.round{width:40px;border-radius:50%}.progress{flex:1;display:flex;gap:3px}.progress span{flex:1;height:3px;border-radius:4px;background:#ffffff40}.progress .done{background:#fff;box-shadow:0 0 8px #fff8}.caption{position:absolute;z-index:4;left:14px;right:14px;bottom:88px;padding:17px 18px 18px;color:#fff;border:1px solid #ffffff33;border-radius:20px;background:linear-gradient(135deg,#051322c9,#030812b8);backdrop-filter:blur(14px)}.caption h2{margin:0 0 5px;font-size:clamp(21px,6vw,30px);line-height:1.05}.caption p{margin:0;color:#eef8ff;font-size:clamp(15px,4.1vw,19px);line-height:1.32}nav{position:absolute;z-index:6;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:14px}nav button{width:46px;height:46px;border:1px solid #ffffff44;border-radius:50%;color:#fff;background:#040f1bb8;font-size:25px}nav button:disabled{opacity:.25}nav .play{width:56px;height:56px;background:#fff;color:#071522;font-size:18px;font-weight:900}.overlay{position:absolute;z-index:3;top:13%;left:50%;transform:translateX(-50%);color:#fff;font-size:clamp(52px,15vw,96px);font-weight:1000;white-space:nowrap;text-shadow:0 0 18px #39d8ff,0 0 42px #1188ff;animation:float 2.2s infinite}.o5{font-size:clamp(36px,10vw,68px);top:11.5%}.o7{font-size:clamp(100px,32vw,190px)}.o11{font-size:clamp(38px,10.5vw,68px);color:#fff5c6;text-shadow:0 0 20px #ff8bd4}.o12{top:7%;font-size:clamp(37px,10vw,68px);color:#fff1a9}.sparkles b{position:absolute;z-index:2;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 12px #73eaff;animation:drift 3s infinite}.sparkles b:nth-child(1){left:12%;top:28%}.sparkles b:nth-child(2){left:82%;top:22%;animation-delay:.7s}.sparkles b:nth-child(3){left:71%;top:49%;animation-delay:1.3s}.sparkles b:nth-child(4){left:23%;top:58%;animation-delay:1.8s}.sparkles b:nth-child(5){left:51%;top:18%;animation-delay:2.2s}.shake .scene img{animation:shake 4s infinite}.drive .scene img,.zoom .scene img{animation:forward 12s ease-out both}.heart .scene img{animation:heart 12s ease-in-out both}.choir .scene img{animation:bounce 2.2s infinite}.finale .scene img{animation:forward 10s ease-out both}.end{position:absolute;z-index:10;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;color:#fff;text-align:center;background:#030812dd;backdrop-filter:blur(14px)}.end h2{margin:4px 0;font-size:clamp(38px,11vw,64px)}.end .primary{max-width:320px;margin-top:24px}@keyframes zoom{to{transform:scale(1.1) translateY(-1%)}}@keyframes ken{from{transform:scale(1.03)}to{transform:scale(1.1) translateY(-1.5%)}}@keyframes pulse{50%{transform:scale(1.25);opacity:.7}}@keyframes drift{50%{transform:translateY(-18px) scale(1.8);opacity:.35}}@keyframes float{50%{transform:translate(-50%,-8px) rotate(-1deg)}}@keyframes shake{0%,100%{transform:scale(1.07)}30%{transform:scale(1.075) rotate(.25deg)}65%{transform:scale(1.07) rotate(-.2deg)}}@keyframes forward{from{transform:scale(1.02)}to{transform:scale(1.14) translateY(-2%)}}@keyframes heart{0%{transform:scale(1.04)}45%{transform:scale(1.09)}100%{transform:scale(1.12)}}@keyframes bounce{0%,100%{transform:scale(1.07)}50%{transform:scale(1.075) translateY(-3px)}}@media(min-width:700px){.story,.start-screen{left:50%;width:min(100%,500px);transform:translateX(-50%);box-shadow:0 0 80px #000}body{background:radial-gradient(circle,#18304a,#020711 65%)}}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important}}