.buy-bonus-dialog .buy-frame-effects{position:absolute;inset:0;z-index:-1;pointer-events:none;user-select:none;overflow:hidden}
.buy-bonus-dialog .buy-frame-effects>svg{position:absolute;display:none}
.buy-bonus-dialog .buy-frame-effects>.buy-frame-fx-full{display:block;inset:0;width:100%;height:100%}
.buy-bonus-dialog .buy-frame-defs{width:0;height:0}
.buy-bonus-dialog .buy-frame-bubble{animation:buyFrameBubble var(--duration) linear var(--delay) infinite;opacity:0}
.buy-bonus-dialog .buy-frame-fluid-glow{opacity:.025;animation:buyFrameFluid 4.7s ease-in-out var(--delay) infinite}
.buy-bonus-dialog .buy-frame-pipe{fill:none;stroke:#ef6dff;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;opacity:.04;filter:drop-shadow(0 0 5px #d82cff);animation:buyFramePipe 4.4s ease-in-out var(--delay) infinite}
.buy-bonus-dialog .buy-frame-electric{opacity:0;animation:buyFrameElectric 6.3s linear var(--delay) infinite}
.buy-bonus-dialog .buy-frame-electric path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.buy-bonus-dialog .buy-frame-electric-glow{stroke:#b7a6ff;stroke-width:5;opacity:.35;filter:blur(2px)}
.buy-bonus-dialog .buy-frame-electric-core{stroke:#f1e8ff;stroke-width:1.35}
.buy-bonus-dialog .buy-frame-electric-branch{stroke:#d8cbff;stroke-width:1;opacity:.55}
@keyframes buyFrameBubble{0%{opacity:0;transform:translate(0,0)}12%{opacity:.68}80%{opacity:.7}100%{opacity:0;transform:translate(var(--drift),calc(-1 * var(--rise)))}}
@keyframes buyFrameFluid{50%{opacity:.08}}
@keyframes buyFramePipe{0%,100%{opacity:.025;stroke-width:6}50%{opacity:.25;stroke-width:8}}
@keyframes buyFrameElectric{0%,4%,9%,100%{opacity:0}1%,6%{opacity:.45}2%,7%{opacity:.12}}
.buy-bonus-dialog[data-motion-paused="true"] .buy-frame-effects *,
.buy-bonus-dialog[data-motion-paused="true"] .buy-art,
.buy-bonus-dialog[data-motion-paused="true"] .buy-art *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.buy-bonus-dialog .buy-frame-effects{display:none}}
body:has(#game.reduced-motion) .buy-bonus-dialog .buy-frame-effects,.reduced-motion .buy-bonus-dialog .buy-frame-effects{display:none}
/* Match the compact frame's 280/200/160 source slices and 80/48/42 CSS borders. */
@media(max-width:700px),(max-height:570px){
 .buy-bonus-dialog .buy-frame-effects>.buy-frame-fx-full{display:none}
 .buy-bonus-dialog .buy-frame-effects>svg:not(.buy-frame-defs):not(.buy-frame-fx-full){display:block}
 .buy-bonus-dialog .buy-frame-fx-tl{left:0;top:0;width:48px;height:80px}
 .buy-bonus-dialog .buy-frame-fx-t{left:48px;right:48px;top:0;width:calc(100% - 96px);height:80px}
 .buy-bonus-dialog .buy-frame-fx-tr{right:0;top:0;width:48px;height:80px}
 .buy-bonus-dialog .buy-frame-fx-l{left:0;top:80px;width:48px;height:calc(100% - 122px)}
 .buy-bonus-dialog .buy-frame-fx-r{right:0;top:80px;width:48px;height:calc(100% - 122px)}
 .buy-bonus-dialog .buy-frame-fx-bl{left:0;bottom:0;width:48px;height:42px}
 .buy-bonus-dialog .buy-frame-fx-b{left:48px;right:48px;bottom:0;width:calc(100% - 96px);height:42px}
 .buy-bonus-dialog .buy-frame-fx-br{right:0;bottom:0;width:48px;height:42px}
}