/* A transparent illustration becomes a small, layered shore vignette at the finale. */
.finale-seaside{position:absolute;left:-40px;bottom:-10px;width:190px;height:190px;margin:0;perspective:850px;transform-style:preserve-3d;pointer-events:none;z-index:3;isolation:isolate}
.finale-seaside img{position:relative;display:block;width:100%;height:auto;z-index:2;transform-origin:50% 92%;transform:translateZ(15px) rotateY(-5deg);filter:drop-shadow(4px 7px 5px #07132166);animation:seaside-breathe 10s ease-in-out infinite}
.seaside-glow{position:absolute;inset:0 -12% 10%;border-radius:50%;background:radial-gradient(ellipse at 60% 55%,#e6d1a81f,transparent 65%);transform:translateZ(-20px)}
.seaside-ground{position:absolute;left:8%;right:3%;bottom:3%;height:9%;border-radius:50%;background:#040d173b;filter:blur(7px);transform:rotateX(60deg);z-index:1}
.seaside-water{position:absolute;left:52%;right:-17%;top:54%;height:28%;overflow:hidden;transform:rotateX(48deg) rotateZ(-9deg);z-index:0}
.seaside-water i{position:absolute;left:-15%;width:130%;height:22px;top:4px;border-top:1px solid #f3dcaf66;border-radius:50%;box-shadow:0 -3px 9px #e8d1a416;animation:seaside-ripple 6s ease-in-out infinite}
.seaside-water i+i{top:22px;animation-delay:-3s;opacity:.6}
.name-theater.reveal~.finale-seaside{animation:seaside-arrive 2.4s cubic-bezier(.2,.7,.2,1) .25s both}
@keyframes seaside-arrive{from{opacity:0;transform:translate3d(-18px,18px,-40px) rotateY(8deg)}to{opacity:1;transform:translateZ(0) rotateY(0)}}
@keyframes seaside-breathe{0%,100%{transform:translateZ(15px) rotateY(-5deg) rotateZ(-.25deg)}50%{transform:translateZ(19px) rotateY(-2deg) rotateZ(.3deg)}}
@keyframes seaside-ripple{0%,100%{transform:translateY(-3px) scaleX(.9);opacity:.3}50%{transform:translateY(8px) scaleX(1.05);opacity:.7}}
@media(min-width:651px) and (max-width:1000px){.finale-seaside{left:0;width:145px;height:145px;bottom:-8px}.constellation-wrap>svg#constellation{width:60%}}
@media(max-width:650px){.finale-seaside{position:relative;left:auto;bottom:auto;width:128px;height:128px;margin:-18px auto -3px 1%;}.seaside-water{right:-25%}.name-theater.reveal~.finale-seaside{animation-duration:1.8s}}
@media(prefers-reduced-motion:reduce){.name-theater.reveal~.finale-seaside,.finale-seaside img,.seaside-water i{animation:none!important}}
body.cosmos-resting .finale-seaside,body.cosmos-resting .finale-seaside img,body.cosmos-resting .seaside-water i{animation-play-state:paused!important}
