/* V5.5 — a stronger physical charge and detonation, independent of the water scene. */

/* Fixed-center 3D spin: rotation accelerates while the vault stays in place. */
.stage { perspective: 1100px; }
.chest-zone { transform-style: preserve-3d; transform-origin: 50% 50%; }
.charge .chest-zone { animation: torqueSpin 2.35s linear both !important; }
.charge .chest-piece { transform-style: preserve-3d; backface-visibility: visible; }
.charge .chest-piece img { animation: metalShimmer 2.35s ease-in both; }
.charge .chest-zone::after { content:""; position:absolute; inset:4% -8%; pointer-events:none; border-radius:50%; opacity:0; mix-blend-mode:screen; background:linear-gradient(112deg,transparent 27%,#ffffffc9 46%,#a6fff7b5 51%,transparent 65%); filter:blur(7px); animation: spinReflection 2.35s ease-in both; }
.charge .energy-core { animation: coreSpinCharge 2.35s ease-in both !important; }
.charge .chest-glow { animation: spinGlow 2.35s ease-in both !important; }

/* Expand the blast's physical footprint: parts, rings, flash and bubble pressure. */
.open .chest-zone { animation: violentDetonation .76s cubic-bezier(.07,.86,.14,1) both !important; }
.open .chest-lid { animation: lidEject .46s .02s cubic-bezier(.08,.9,.15,1) both !important; }
.open .chest-body { animation: bodyEject .54s .02s cubic-bezier(.08,.85,.16,1) both !important; }
.open .chest-fragment.f1 { --x:-278px; --y:-158px; --r:-62deg; }
.open .chest-fragment.f2 { --x:-58px; --y:-270px; --r:33deg; }
.open .chest-fragment.f3 { --x:284px; --y:-164px; --r:68deg; }
.open .chest-fragment.f4 { --x:-252px; --y:172px; --r:-55deg; }
.open .chest-fragment.f5 { --x:18px; --y:276px; --r:25deg; }
.open .chest-fragment.f6 { --x:270px; --y:160px; --r:58deg; }
.open .chest-fragment { animation-duration: .72s; }
.open .burst { background:radial-gradient(circle,#ffffff 0 6%,#dfffffdc 10%,#8afff1a9 25%,#21cae176 46%,transparent 73%); filter:blur(.3px) brightness(1.3); animation: megaDetonation .7s .02s ease-out both !important; }
.impact-ring { border-width:4px; box-shadow:0 0 24px #92fff8,0 0 42px #4de6e1; }
.ring-a { width:138px; height:138px; }
.ring-b { width:260px; height:260px; }
.open .ring-a { animation: shockwaveHard .58s .04s ease-out both; }
.open .ring-b { animation: shockwaveHard .76s .1s ease-out both; }
.open .burst-bubble { border-width:1.5px; box-shadow:inset 1px 1px 2px #fff,0 0 12px #b6fff9; }
.open .burst-bubble { animation-duration:.82s; }

@keyframes torqueSpin {
  0% { transform:translate(-50%,-48%) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(.98); animation-timing-function:cubic-bezier(.33,0,.7,.5); }
  24% { transform:translate(-50%,-48%) rotateY(-16deg) rotateX(-4deg) rotateZ(-1deg) scale(1); animation-timing-function:cubic-bezier(.17,.72,.24,1); }
  45% { transform:translate(-50%,-48%) rotateY(36deg) rotateX(7deg) rotateZ(1deg) scale(1.05); animation-timing-function:cubic-bezier(.1,.74,.18,1); }
  64% { transform:translate(-50%,-48%) rotateY(-42deg) rotateX(-6deg) rotateZ(-1deg) scale(1.11); animation-timing-function:cubic-bezier(.12,.77,.18,1); }
  80% { transform:translate(-50%,-48%) rotateY(40deg) rotateX(6deg) rotateZ(1deg) scale(1.17); animation-timing-function:cubic-bezier(.16,.72,.24,1); }
  91% { transform:translate(-50%,-48%) rotateY(-28deg) rotateX(-3deg) rotateZ(0deg) scale(1.23); animation-timing-function:cubic-bezier(.4,0,.7,.4); }
  100% { transform:translate(-50%,-48%) rotateY(12deg) rotateX(0deg) rotateZ(0deg) scale(1.3); }
}
@keyframes metalShimmer { 0% { filter:brightness(.92) saturate(.92); } 46% { filter:brightness(1.15) saturate(1.08); } 78% { filter:brightness(1.52) saturate(1.18) contrast(1.1); } 100% { filter:brightness(1.92) saturate(1.25) contrast(1.15); } }
@keyframes spinReflection { 0% { opacity:0; transform:translateX(-58%) rotate(-8deg); } 42% { opacity:.28; transform:translateX(-12%) rotate(3deg); } 78% { opacity:.7; transform:translateX(38%) rotate(-5deg); } 100% { opacity:1; transform:translateX(72%) rotate(4deg); } }
@keyframes coreSpinCharge { 0% { opacity:0; transform:scale(.22); } 55% { opacity:.68; transform:scale(1.25); } 84% { opacity:1; transform:scale(2.12); } 100% { opacity:1; transform:scale(2.8); } }
@keyframes spinGlow { 0% { opacity:.2; transform:scale(.45); } 62% { opacity:.72; transform:scale(1.85); } 100% { opacity:1; transform:scale(3.45); } }
@keyframes violentDetonation { 0% { transform:translate(-50%,-48%) scale(1.39); } 10% { transform:translate(-50%,-48%) scale(1.82) rotateY(16deg); } 25% { transform:translate(-50%,-48%) scale(1.48) rotateY(-12deg); } 58% { transform:translate(-50%,-62%) scale(.75) rotateY(28deg) rotateZ(-17deg); opacity:1; } 100% { transform:translate(-50%,-92%) scale(.08) rotateY(60deg) rotateZ(28deg); opacity:0; } }
@keyframes lidEject { from { transform:translate(0) rotate(0); opacity:1; } to { transform:translate(202px,-254px) rotate(74deg) scale(1.48); filter:brightness(2.8); opacity:0; } }
@keyframes bodyEject { from { transform:translate(0) rotate(0); opacity:1; } to { transform:translate(-180px,202px) rotate(-46deg) scale(.66); filter:brightness(2.3); opacity:0; } }
@keyframes megaDetonation { 0% { opacity:0; transform:translate(-50%,-50%) scale(.06); } 12% { opacity:1; transform:translate(-50%,-50%) scale(1.15); } 35% { opacity:.86; transform:translate(-50%,-50%) scale(1.65); } 100% { opacity:0; transform:translate(-50%,-50%) scale(2.35); } }
@keyframes shockwaveHard { 0% { opacity:0; transform:translate(-50%,-50%) scale(.08); } 12% { opacity:1; } 100% { opacity:0; transform:translate(-50%,-50%) scale(5.3); } }
