/* VYX's reveal is a presentation of a finalized receipt, never an allocator. */
.sky-scene.wonder-scene{position:relative;isolation:isolate;overflow:hidden;min-width:0;height:330px;border-radius:14px;background:#1c1426;color:#e4c8a0;perspective:1000px}
.wonder-environment{position:absolute;inset:0;background:url('/assets/wonder/drop-sanctuary.webp') center center/cover no-repeat;opacity:.83;transform:scale(1.025)}
.wonder-vignette{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#140f20a6,transparent 40%,#190e2815 80%),linear-gradient(90deg,#160c2638,transparent 35%,transparent 65%,#160c2638)}
.wonder-halo{position:absolute;z-index:2;left:calc(50% - 88px);top:16%;width:176px;height:37px;border:1px solid #ffe0aa55;border-radius:50%;transform:rotate(-7deg);box-shadow:0 0 30px #ffd8a21a;opacity:.4}.wonder-halo i{position:absolute;inset:-6px -18px;border:1px solid #edbc7d33;border-radius:50%;transform:rotate(7deg)}.wonder-halo i+i{inset:8px 22px;transform:rotate(-3deg)}
.wonder-shaft{position:absolute;z-index:2;top:17%;left:calc(50% - 100px);width:200px;height:60%;clip-path:polygon(20% 0,80% 0,100% 100%,0 100%);background:linear-gradient(#f6d79d18,#eabf8a03);filter:blur(5px)}
.wonder-floor{position:absolute;z-index:2;left:calc(50% - 100px);top:77%;width:200px;height:28px;background:#f1b95f18;border:1px solid #f2c88950;border-radius:50%;box-shadow:0 0 26px #e9ac5833;transform:rotate(-3deg)}
.wonder-object{position:absolute;z-index:4;width:74%;max-width:550px;aspect-ratio:3/2;left:50%;top:36%;transform:translate(-50%,-6%) rotate(-5deg);transform-origin:50% 65%;filter:drop-shadow(0 20px 15px #05020c70)}
.wonder-object>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;max-width:none;pointer-events:none}.wonder-chest-closed{opacity:1}.wonder-object>.wonder-chest-open{opacity:0;transform:translateY(-3%) scale(1.01)}
.wonder-object-glow{position:absolute;z-index:-1;inset:10% 9%;border-radius:50%;background:#d58c512a;filter:blur(25px);transform:scale(1.04)}
.wonder-dust{position:absolute;z-index:3;inset:0;pointer-events:none;overflow:hidden}.wonder-dust>i{position:absolute;left:var(--x);top:var(--y);height:var(--size);width:var(--size);border-radius:50%;background:#ffe8b5;box-shadow:0 0 7px #f4d29a;opacity:.1;animation:wonder-drift var(--duration) var(--delay) ease-in-out infinite}
.wonder-release{position:absolute;z-index:5;inset:20% 14% 10%;border-radius:50%;background:radial-gradient(ellipse,#ffe9bb50,transparent 65%);opacity:0;transform:scale(.4);pointer-events:none}.wonder-wave{position:absolute;z-index:3;left:20%;width:60%;top:74%;height:15%;border:1px solid #f9d7a5;border-radius:50%;opacity:0;pointer-events:none}
.scene-coordinate,.scene-serial{position:absolute;z-index:6;bottom:16px;font:7px/1.3 'DM Sans',sans-serif;font-weight:500;letter-spacing:1.7px;color:#e5cead88}.scene-coordinate{left:19px}.scene-serial{right:19px}
[data-sky-state=arriving] .wonder-object{animation:wonder-descent 2.3s cubic-bezier(.2,.65,.3,1) both}[data-sky-state=arriving] .wonder-environment{animation:wonder-room-light 2.3s ease-out both}[data-sky-state=arriving] .wonder-wave{animation:wonder-arrival-wave 1s 1.25s ease-out both}[data-sky-state=arriving] .wonder-shaft{animation:wonder-light-fall 2s both}
[data-sky-state=opening] .wonder-chest-closed{animation:wonder-close-out 1.4s both}[data-sky-state=opening] .wonder-chest-open{animation:wonder-open-in 1.8s both}[data-sky-state=opening] .wonder-release{animation:wonder-release-light 2.1s both}[data-sky-state=opening] .wonder-wave{animation:wonder-arrival-wave 1.5s .2s both}[data-sky-state=opening] .wonder-shaft{animation:wonder-light-open 2.1s both}[data-sky-state=opening] .wonder-object-glow{animation:wonder-aura-open 2s both}
[data-sky-state=materialize] .wonder-object{animation:wonder-materialize 2.3s ease both}[data-sky-state=energy] .wonder-object{animation:wonder-energy 2.3s ease both}
@keyframes wonder-drift{0%,100%{opacity:.04;transform:translate3d(0,7px,0)}45%{opacity:.6;transform:translate3d(5px,-18px,0)}70%{opacity:.15;transform:translate3d(-4px,-26px,0)}}
@keyframes wonder-descent{0%{opacity:0;transform:translate(-50%,-145%) scale(.5) rotate(5deg);filter:blur(6px)}23%{opacity:.5}65%{opacity:1;filter:blur(0);transform:translate(-50%,-3%) scale(1.01) rotate(-6deg)}85%{transform:translate(-50%,-9%) scale(1) rotate(-5deg)}100%{opacity:1;transform:translate(-50%,-6%) rotate(-5deg)}}
@keyframes wonder-room-light{from{opacity:.25;transform:scale(1.055)}to{opacity:.83;transform:scale(1.025)}}
@keyframes wonder-arrival-wave{from{opacity:.7;transform:scale(.4)}to{opacity:0;transform:scale(1.85)}}
@keyframes wonder-light-fall{0%{opacity:0;transform:scaleX(.2)}35%{opacity:.7}100%{opacity:1;transform:scaleX(1)}}
@keyframes wonder-close-out{0%,20%{opacity:1}70%,100%{opacity:0}}
@keyframes wonder-open-in{0%,12%{opacity:0;transform:translateY(0) scale(.99)}65%,100%{opacity:1;transform:translateY(-3%) scale(1.01)}}
@keyframes wonder-release-light{0%{opacity:0;transform:scale(.4)}45%{opacity:.85;transform:scale(1.2)}100%{opacity:.2;transform:scale(1.65)}}
@keyframes wonder-light-open{0%{opacity:1}45%{opacity:.85;transform:scaleX(1.5)}100%{opacity:.55;transform:scaleX(1.1)}}
@keyframes wonder-aura-open{to{background:#f3bb7655;transform:scale(1.3)}}
@keyframes wonder-materialize{from{opacity:0;filter:blur(18px);transform:translate(-50%,7%) scale(.88)}to{opacity:1;filter:blur(0);transform:translate(-50%,-6%) rotate(-5deg)}}
@keyframes wonder-energy{from{opacity:0;filter:brightness(2);transform:translate(-50%,-6%) scale(.25)}65%{opacity:1;filter:brightness(1.3);transform:translate(-50%,-6%) scale(1.04)}to{filter:brightness(1);transform:translate(-50%,-6%) rotate(-5deg)}}
body.wonder-paused .wonder-scene *{animation-play-state:paused!important}
body[data-motion=reduced] .wonder-scene *{animation:none!important;transition:none!important}body[data-motion=reduced] [data-sky-state=opening] .wonder-chest-closed{opacity:0}body[data-motion=reduced] [data-sky-state=opening] .wonder-chest-open{opacity:1}
@media(max-width:760px){.wonder-dust>i:nth-child(n+13){display:none}.scene-coordinate,.scene-serial{font-size:6px;letter-spacing:1.3px}.scene-coordinate{left:14px}.scene-serial{right:14px}.wonder-object{width:89%;top:39%}.wonder-halo{width:145px;left:calc(50% - 72px)}}
@media(prefers-reduced-motion:reduce){.wonder-scene *{animation:none!important;transition:none!important}[data-sky-state=opening] .wonder-chest-closed{opacity:0}[data-sky-state=opening] .wonder-chest-open{opacity:1}}