/* Ambient loops stay on decorative layers so text and controls remain steady. */
.backdrop-haze{inset:-12%;background:radial-gradient(ellipse at 25% 35%,#c3233920,transparent 38%),radial-gradient(ellipse at 78% 65%,#d3364912,transparent 36%);animation:ambient-drift 18s ease-in-out infinite alternate;pointer-events:none}
.token-drift{animation:token-orbit var(--duration,16s) ease-in-out infinite;animation-delay:var(--delay,0s)}
.main-action{position:relative;overflow:hidden;isolation:isolate}
.main-action.ready:after{content:'';position:absolute;inset:-80% auto -80% -60%;width:35%;background:linear-gradient(90deg,transparent,#fff3,transparent);transform:rotate(22deg) translateX(-180%);animation:button-gleam 7s ease-in-out infinite;pointer-events:none}
.wallet-token img{animation:art-bob 6s ease-in-out infinite}
.wallet-token:nth-child(2) img{animation-delay:-2s}.wallet-token:nth-child(3) img{animation-delay:-4s}
.badge-art span{animation:art-bob 7s ease-in-out infinite}.badge-art span:nth-child(2){animation-delay:-2.3s}.badge-art span:nth-child(3){animation-delay:-4.6s}
.globe-art img{animation:globe-sway 12s ease-in-out infinite}
.motion-suspended .token-drift,.motion-suspended .backdrop-haze,.motion-suspended .main-action:after,.motion-suspended .wallet-token img,.motion-suspended .badge-art span,.motion-suspended .globe-art img{animation-play-state:paused}
@keyframes token-orbit{0%,100%{transform:translate3d(0,0,0) rotate(-3deg)}25%{transform:translate3d(var(--dx,18px),-12px,0) rotate(3deg)}50%{transform:translate3d(var(--dx,18px),var(--dy,22px),0) rotate(var(--rotation,8deg))}75%{transform:translate3d(-8px,var(--dy,22px),0) rotate(0)}}
@keyframes ambient-drift{from{transform:translate3d(-3%,-2%,0) scale(1);opacity:.6}to{transform:translate3d(4%,3%,0) scale(1.08);opacity:1}}
@keyframes button-gleam{0%,65%{transform:rotate(22deg) translateX(-180%)}90%,100%{transform:rotate(22deg) translateX(750%)}}
@keyframes art-bob{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes globe-sway{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(3deg)}}
@media(max-width:700px){.backdrop-haze{opacity:.65}.token-drift{animation-duration:22s}.main-action.ready:after{animation-duration:9s}}
@media(prefers-reduced-motion:reduce){.token-drift,.backdrop-haze,.main-action.ready:after,.wallet-token img,.badge-art span,.globe-art img{animation:none!important}.main-action.ready:after{display:none}}