/* 波波乐园 · celebration effects (js/fx.js) */
.fx-bit,.fx-pop{position:fixed;z-index:400;pointer-events:none}
.fx-bit svg,.fx-pop svg{display:block;width:100%;height:100%;overflow:visible}
.fx-pop{z-index:399}

/* reward card */
.reward>*{position:relative;z-index:1}
.reward>.fx-sunwrap{position:absolute;z-index:0;left:50%;top:150px;width:min(560px,130%);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:.95}
.fx-sun{width:100%;height:100%;display:block;animation:fxTurn 40s linear infinite}
.fx-title{display:grid;place-items:center;max-width:540px;margin:0 auto;padding:6px 64px 12px}
.fx-title .fx-banner{position:absolute;inset:0;width:100%;height:100%;z-index:-1;filter:drop-shadow(4px 5px 0 rgba(43,29,20,.9))}
.fx-title h2{margin:0}
.reward .bigstars svg{cursor:pointer;-webkit-tap-highlight-color:transparent;filter:drop-shadow(0 4px 0 rgba(43,29,20,.25))}
.reward .bigstars svg:not(.off){animation:starIn .6s cubic-bezier(.3,1.7,.5,1) both,fxTwinkle 2.4s ease-in-out 1.8s infinite;animation-delay:var(--t),calc(var(--t) + 1.2s)}
.fx-balloon{position:fixed;top:0;z-index:2;padding:0;margin:0;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.fx-balloon svg{display:block;width:100%;height:100%;overflow:visible}
@keyframes fxTurn{to{transform:rotate(360deg)}}
@keyframes fxTwinkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.08) rotate(6deg)}}
@media (max-width:760px){.fx-title{padding:4px 44px 10px}}
@media (prefers-reduced-motion:reduce){.fx-sun,.reward .bigstars svg:not(.off){animation:none}}

/* Bobo asks after a unit */
.fx-ask{position:absolute;inset:0;z-index:5;display:grid;place-items:center;padding:16px;background:rgba(43,29,20,.28);animation:fadeIn .25s}
.fx-ask.out{opacity:0;transition:opacity .25s}
.fx-askcard{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;align-items:end;width:min(600px,100%);padding:18px 20px;background:var(--paper,#fffaf0);border:5px solid var(--ink);border-radius:28px;box-shadow:8px 8px 0 var(--ink);animation:bpop .45s cubic-bezier(.3,1.6,.5,1)}
.fx-askbobo{width:150px}
.fx-asktext{margin:0 0 12px;padding:12px 14px;background:#fff;border:3px solid var(--ink);border-radius:18px;font:800 18px/1.6 var(--f-body);min-height:3.2em;position:relative}
.fx-asktext::after{content:"";position:absolute;left:-12px;bottom:18px;width:16px;height:16px;background:#fff;border-left:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(45deg)}
.fx-askstats{display:flex;gap:10px;margin-bottom:14px}
.fx-askstats span{display:grid;justify-items:center;min-width:86px;padding:6px 12px;border:3px solid var(--ink);border-radius:16px;font:800 13px var(--f-body)}
.fx-askstats b{font:800 32px/1.1 var(--f-num)}
.fx-askstats .ok{background:#dff7e7}.fx-askstats .ok b{color:#1d8a4f}
.fx-askstats .no{background:#ffe4dc}.fx-askstats .no b{color:#d6402f}
.fx-askbtns{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:640px){.fx-askcard{grid-template-columns:1fr;justify-items:center}.fx-askbobo{width:110px}.fx-asktext::after{display:none}.fx-asktext{font-size:16px}}
