/* P0 reset: deep-water optics, decisive chest travel, clean result hierarchy. */
.stage{background:radial-gradient(ellipse at 50% -6%,#b9fff0 0,#55dfd6 12%,#159eb1 31%,#076d92 51%,#06426f 72%,#031537 100%)}
.water-surface{left:-9%;right:-9%;top:-19px;height:135px;opacity:.94;background:radial-gradient(ellipse at 50% 0,#f2fff9 0 3%,#c4fff2aa 15%,transparent 58%),linear-gradient(105deg,#9cf5e9a6,#e4fff49a 31%,#68dbdd9e 58%,#d2fff3ac);filter:blur(2px);animation:surfaceDrift 8s ease-in-out infinite alternate}
.water-surface:after{background:linear-gradient(90deg,transparent 0,#fff9 46%,transparent 72%);filter:blur(7px)}
.ray{height:94%;width:26%;background:linear-gradient(180deg,#edfffcc7 0,#b7fff281 23%,#84efe54a 51%,transparent 96%);filter:blur(19px);opacity:.62;clip-path:polygon(41% 0,62% 0,100% 100%,0 100%);animation:deepRays 7s ease-in-out infinite alternate}
.ray.r1{left:-1%}.ray.r2{left:36%;width:32%;opacity:.52}.ray.r3{right:-4%;opacity:.5}
/* Replaces the ring-like line pattern with soft, moving refracted light patches. */
.caustics{inset:68px -8% 17%;opacity:.54;filter:blur(10px);mix-blend-mode:screen;background:radial-gradient(ellipse 18% 5% at 17% 12%,#ecfffbbd 0 15%,transparent 60%),radial-gradient(ellipse 14% 4% at 66% 18%,#b8fff4a8 0 16%,transparent 65%),radial-gradient(ellipse 20% 5% at 40% 39%,#c3fff594 0 12%,transparent 62%),radial-gradient(ellipse 16% 4% at 82% 54%,#f0fffb83 0 13%,transparent 66%),radial-gradient(ellipse 22% 5% at 26% 72%,#a5fff199 0 13%,transparent 65%);background-size:180% 150%;animation:causticDrift 11s ease-in-out infinite alternate}
.depth-haze{inset:42% 0 0;background:linear-gradient(180deg,transparent,#04336566 39%,#021532c9 100%)}
.stage:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 23%,transparent 0 25%,#00365717 62%,#00112762 100%)}
.hud,.headline,.vault-picker,.chest-zone,.burst,.reveal-card,.result-panel,.playbar,.replay{z-index:4}.ray,.caustics,.depth-haze,.water-surface{z-index:0}
.chest-body{clip-path:polygon(0 41%,100% 41%,100% 100%,0 100%)}.chest-lid{clip-path:polygon(0 0,100% 0,100% 41%,0 41%)}.chest-zone{filter:drop-shadow(0 30px 23px #001128cc)}.chest-glow{background:radial-gradient(ellipse,#d9fffdb0 0 7%,#6ee9e79a 22%,#1aa9c46e 42%,transparent 73%);filter:blur(13px)}
/* The first 0.7s has obvious X/Y travel, rotation and scale; it cannot read as a static asset. */
.charge .chest-zone{animation:powerLaunch .72s cubic-bezier(.22,.79,.19,1) both}.charge .chest-glow{animation:chargeBloom .72s ease-out both}.charge .chest-lid,.charge .chest-body{animation:none}
.open .chest-zone{animation:chestDetonate .72s cubic-bezier(.12,.8,.2,1) both}.open .chest-lid{animation:lidBlast .43s .05s cubic-bezier(.14,.9,.2,1) both}.open .chest-body{animation:bodyBlast .58s .04s cubic-bezier(.13,.84,.22,1) both}
.burst{top:49%;width:470px;height:470px;background:radial-gradient(circle,#ffffff 0 3%,#d6fffbcf 7%,#60f2eb8a 20%,#1bb1cf50 37%,transparent 68%);filter:blur(1px);opacity:0}.burst:before,.burst:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 5%,#fff 0 2px,transparent 3px),radial-gradient(circle at 82% 20%,#d8fff9 0 3px,transparent 4px),radial-gradient(circle at 13% 37%,#aafff5 0 2px,transparent 3px),radial-gradient(circle at 73% 69%,#e1fffb 0 3px,transparent 4px),radial-gradient(circle at 31% 84%,#b9fff7 0 2px,transparent 3px);filter:drop-shadow(0 0 6px #c4fff9);opacity:0}.burst:after{transform:rotate(37deg) scale(.86)}.open .burst{animation:flashBurst .56s .12s ease-out both}.open .burst:before{animation:bubbleEject .62s .13s ease-out both}.open .burst:after{animation:bubbleEjectTwo .62s .16s ease-out both}
.reveal .reveal-card{animation:cardExplosionReveal .72s cubic-bezier(.1,.88,.18,1) both}.reveal-card .card-inner{box-shadow:0 30px 42px #001a3fb8;outline:0}.reveal-card img{outline:0;border:0}
/* Result hierarchy: product > name > SKU > free-standing price. */
.result .reveal-card{top:42%;animation:resultCardFloat 3.1s ease-in-out infinite}.result-panel{bottom:31px;padding:0 18px}.result-panel strong{font-size:31px;line-height:1.03;letter-spacing:-.035em;color:#f1fffc;text-shadow:0 2px 13px #00334d}.result-panel span{margin-top:8px;font-size:14px;letter-spacing:.13em;color:#b8fff2;font-weight:750}.price-tag{display:flex;margin:13px auto 0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;width:max-content;color:#eafffa;gap:8px;text-shadow:0 2px 10px #004c6f}.price-tag i{font-size:10px;color:#84ece7;letter-spacing:.22em}.price-char{font-size:28px;color:#fff;text-shadow:0 0 12px #78fff0}.result .price-tag{animation:priceFreeIn .28s .82s ease-out both}.result .price-char{animation:digitPop .3s calc(.89s + var(--i) * .12s) cubic-bezier(.18,.86,.22,1) both}
@keyframes surfaceDrift{to{transform:skewY(2deg) translateX(-6%) scaleY(1.08)}}@keyframes deepRays{to{transform:skewX(9deg) scaleX(1.22);opacity:.74}}@keyframes causticDrift{to{background-position:18% 11%;transform:scale(1.1) rotate(1deg)}}
@keyframes powerLaunch{0%{transform:translate(-50%,-48%) scale(.78) rotate(-7deg)}18%{transform:translate(-67%,-58%) scale(.9) rotate(10deg)}38%{transform:translate(-33%,-42%) scale(1.1) rotate(-13deg)}57%{transform:translate(-59%,-64%) scale(1.19) rotate(10deg)}78%{transform:translate(-43%,-39%) scale(1.32) rotate(-8deg)}100%{transform:translate(-50%,-50%) scale(1.42) rotate(0)}}
@keyframes chargeBloom{0%{opacity:.3;transform:scale(.6)}74%{opacity:1;transform:scale(2.1)}100%{opacity:.8;transform:scale(1.6)}}
@keyframes chestDetonate{0%{transform:translate(-50%,-50%) scale(1.42)}15%{transform:translate(-50%,-50%) scale(1.63) rotate(-5deg)}38%{transform:translate(-50%,-47%) scale(1.3) rotate(9deg)}72%{transform:translate(-50%,-64%) scale(.62) rotate(-12deg);opacity:1}100%{transform:translate(-50%,-85%) scale(.18) rotate(20deg);opacity:0}}
@keyframes lidBlast{0%{transform:translate(0,0) rotate(0);filter:brightness(1)}100%{transform:translate(112px,-168px) rotate(34deg) scale(1.13);filter:brightness(2.2);opacity:0}}@keyframes bodyBlast{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-76px,112px) rotate(-19deg) scale(.8);filter:brightness(1.8);opacity:0}}
@keyframes flashBurst{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}18%{opacity:1;transform:translate(-50%,-50%) scale(.72)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.42)}}@keyframes bubbleEject{0%{opacity:0;transform:scale(.25)}25%{opacity:1}100%{opacity:0;transform:translate(-66px,-100px) scale(1.5)}}@keyframes bubbleEjectTwo{0%{opacity:0;transform:scale(.18)}22%{opacity:1}100%{opacity:0;transform:translate(83px,-73px) scale(1.65)}}
@keyframes cardExplosionReveal{0%{opacity:0;transform:translate(-50%,18%) scale(.25) rotateY(98deg) rotate(-18deg)}38%{opacity:1;transform:translate(-50%,-51%) scale(1.18) rotateY(-12deg) rotate(3deg)}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotateY(0) rotate(0)}}@keyframes resultCardFloat{50%{transform:translate(-50%,-53%) rotate(1.4deg)}}@keyframes priceFreeIn{0%{opacity:0;transform:translateY(9px)}100%{opacity:1;transform:translateY(0)}}
@media(max-width:470px){.result .reveal-card{top:40%}.result-panel strong{font-size:28px}.result-panel span{font-size:13px}.price-char{font-size:25px}}
