/* BATTLE-PAPER-ART-POLISH-01: same anchors, original art, paper props. */
.is-playfield #arena.arena{height:clamp(500px,calc(100svh - 234px),610px)}
.is-playfield #arena .unit img{height:66px;max-width:80px;bottom:8px}
/* Restore only the transparent crown silhouette, without doubling the scenic backdrop. */
@media(max-width:699px){
 .is-playfield #arena.arena{background-image:linear-gradient(#263c43 0 18%,#263c4300 28%),url('assets/stage/battle-stage-full.webp');background-size:100% 100%,auto 150%;background-position:center,center 80%}
 .is-playfield #arena.arena:before{content:"";position:absolute;inset:0 0 auto;height:100%;z-index:0;pointer-events:none;background:transparent url('assets/stage/battle-stage-full.webp') center top/auto 100% no-repeat;clip-path:polygon(0 0,100% 0,100% 28%,88% 24%,73% 19%,62% 17%,56% 17%,56% 25%,44% 25%,44% 17%,38% 17%,27% 19%,12% 24%,0 28%)}
}
/* Desktop framing stays identical to r2. Only paper silhouettes grow by 11%. */
@media(min-width:700px){.is-playfield #arena.arena{height:clamp(470px,calc(100svh - 230px),610px)}.is-playfield #arena.arena:before{display:none}.is-playfield #arena .unit img{height:60px;max-width:82px;bottom:8px}}
/* Short screens get a taller theatre, with event text and controls always in reach. */
@media(max-width:699px) and (max-height:649px){
 .is-playfield #arena.arena{height:430px;background-size:100% 100%,auto 200%;background-position:center,center 67%}
 .is-playfield #arena .unit img{height:46px;max-width:70px;bottom:8px}
 #app:has(#arena):has(.play-controls){padding-bottom:132px}
 #app:has(#arena):has(.play-controls) .event{position:fixed;left:7px;right:7px;bottom:calc(58px + env(safe-area-inset-bottom));z-index:46;height:64px;min-height:64px;box-shadow:0 -1px 0 #ad936e}
 #app:has(#arena):has(.play-controls) .play-controls{position:fixed;left:7px;right:7px;bottom:0;z-index:47;min-height:58px;padding-bottom:calc(7px + env(safe-area-inset-bottom))}
}
/* Show approved transparent artwork directly: no shared tile, plate or wrapper. */
.vfx-token,.vfx-negative .vfx-token{border:0;border-radius:0;background:none;box-shadow:none;filter:none}
.vfx-token:before{content:none}
.vfx-token img{filter:none}
/* Only the pale rabbit needs a fine alpha-edge shadow on the warm deck. */
.vfx-token[data-status=rabbit] img{filter:drop-shadow(.45px 0 0 #6e563eaa) drop-shadow(-.45px .6px 0 #6e563e99)}
.vfx-token b{border-radius:0;background:none;box-shadow:none;color:#50372c;text-shadow:0 1px 1px #fff0d3,-1px 0 #fff0d3,1px 0 #fff0d3;clip-path:none}
/* Keep the approved single-heart timing; brighten the artwork without a square halo. */
@keyframes vfx-state-enter{0%{box-shadow:none;filter:brightness(1.35)}100%{box-shadow:none;filter:brightness(1)}}
.vfx-flash{transform-origin:50% 85%;animation:paper-prop-flip .85s both}
.vfx-flash img{filter:none}
.vfx-flash img[src$="painter-rabbit.webp"]{filter:drop-shadow(.45px 0 0 #6e563eaa) drop-shadow(-.45px .6px 0 #6e563e99)}
@keyframes paper-prop-flip{0%{opacity:0;transform:translateY(3px) rotate(-7deg) scale(.88)}18%{opacity:1;transform:translateY(-3px) rotate(2deg) scale(1)}65%{opacity:1;transform:translateY(-1px) rotate(0)}100%{opacity:0;visibility:hidden;transform:translateY(2px) rotate(-2deg) scale(.94)}}
@media(prefers-reduced-motion:reduce){.vfx-flash{animation:vfx-brief .85s both!important}}
