/* arena-fx.css — Swords & Sandals overhaul layer (see load order in index.html). */
/* Combat presentation: speech bubbles, announcer banners, bouncy numbers, crowd cheer, verdict thumbs and KO stars. */
.arena-scene{--fx-ink:var(--ss-ink,#2b1709);--fx-display:var(--ss-font-display,'Lilita One','DM Sans',system-ui,sans-serif);--fx-outline:var(--ss-outline,0 2px 0 #2b1709,2px 0 0 #2b1709,-2px 0 0 #2b1709,0 -2px 0 #2b1709,1.5px 1.5px 0 #2b1709,-1.5px 1.5px 0 #2b1709,1.5px -1.5px 0 #2b1709,-1.5px -1.5px 0 #2b1709,0 4px 6px #0007);--fx-outline-big:0 3px 0 var(--fx-ink),3px 0 0 var(--fx-ink),-3px 0 0 var(--fx-ink),0 -3px 0 var(--fx-ink),2.2px 2.2px 0 var(--fx-ink),-2.2px 2.2px 0 var(--fx-ink),2.2px -2.2px 0 var(--fx-ink),-2.2px -2.2px 0 var(--fx-ink),0 6px 0 var(--fx-ink),3px 5px 0 var(--fx-ink),-3px 5px 0 var(--fx-ink),0 9px 14px #000a}

/* Speech bubbles: cream parchment, ink outline, tail to the speaker. They float on the stage under the HUD (placed by combat-fx.js: above or beside the head) and follow the fighter. */
.arena-scene .speech-bubble{--bubble-bg:var(--ss-parch,#f3e3bd);position:absolute;left:0;top:0;z-index:9;box-sizing:border-box;width:max-content;max-width:min(196px,50vw);padding:6px 11px 7px;background:var(--bubble-bg);color:var(--ss-parch-ink,#3a220f);border:2.5px solid var(--fx-ink);border-radius:15px;box-shadow:inset 0 -3px 0 #e3c78f,0 4px 0 #2b170966,0 7px 12px #0005;font:400 15px/1.14 var(--fx-display);letter-spacing:.2px;text-align:center;text-wrap:balance;white-space:normal;pointer-events:none;opacity:0;transform-origin:50% 100%}
.arena-scene .speech-bubble::before,.arena-scene .speech-bubble::after{content:'';position:absolute;left:var(--tail-x,50%);top:100%;width:0;height:0;border-style:solid;transform:translateX(-50%)}
.arena-scene .speech-bubble::before{border-width:14px 9px 0;border-color:var(--fx-ink) transparent transparent}
.arena-scene .speech-bubble::after{margin-top:-1px;border-width:10px 6px 0;border-color:var(--ss-parch-2,#e3c78f) transparent transparent}
.arena-scene .speech-bubble.speaker-enemy{--bubble-bg:#f6e7c6}
.arena-scene .speech-bubble:is(.tail-left,.tail-right)::before,.arena-scene .speech-bubble:is(.tail-left,.tail-right)::after{top:var(--tail-y,50%);transform:translateY(-50%)}
.arena-scene .speech-bubble.tail-left::before{left:auto;right:100%;border-width:9px 14px 9px 0;border-color:transparent var(--fx-ink) transparent transparent}
.arena-scene .speech-bubble.tail-left::after{left:auto;right:100%;margin:0 -1px 0 0;border-width:6px 10px 6px 0;border-color:transparent var(--bubble-bg) transparent transparent}
.arena-scene .speech-bubble.tail-right::before{left:100%;border-width:9px 0 9px 14px;border-color:transparent transparent transparent var(--fx-ink)}
.arena-scene .speech-bubble.tail-right::after{left:100%;margin:0 0 0 -1px;border-width:6px 0 6px 10px;border-color:transparent transparent transparent var(--bubble-bg)}
.arena-scene .speech-bubble.no-tail::before,.arena-scene .speech-bubble.no-tail::after{display:none}
@media(min-width:700px){.arena-scene .speech-bubble{font-size:16px;max-width:230px}}

/* Announcer: huge outlined display text, upper middle of the arena below the HUD plates. */
.arena-scene .announcer-banner{position:absolute;left:50%;top:22%;z-index:16;display:block;white-space:nowrap;pointer-events:none;opacity:0;font:400 38px/1.05 var(--fx-display);letter-spacing:1px;color:var(--ss-gold,#ffd24a);text-shadow:var(--fx-outline-big);transform:translateX(-50%)}
.arena-scene .announcer-banner>span{display:inline-block;padding:0 4px}
.arena-scene .announcer-banner.is-big{font-size:54px;letter-spacing:2px}
.arena-scene .announcer-banner.tone-gold{color:var(--ss-gold,#ffd24a)}
.arena-scene .announcer-banner.tone-red{color:#ff5b3d}
.arena-scene .announcer-banner.tone-blue{color:#8fd3ff}
.arena-scene .announcer-banner.is-caption{font-size:14px;letter-spacing:1.6px;color:var(--ss-parch,#f3e3bd);text-shadow:0 1px 0 var(--fx-ink);text-transform:uppercase}
.arena-scene .announcer-banner.is-caption>span{padding:5px 14px 6px;border-radius:999px;background:linear-gradient(var(--ss-wood-2,#4d301a),var(--ss-wood,#3b2414));border:2px solid var(--ss-bronze,#c98b3c);box-shadow:inset 0 1px 0 #fff3,0 3px 0 var(--fx-ink),0 6px 10px #0006}
@media(max-width:560px){.arena-scene .announcer-banner{font-size:32px}.arena-scene .announcer-banner.is-big{font-size:46px}.arena-scene .announcer-banner.is-caption{font-size:12px;letter-spacing:1.2px}}
@media(max-height:430px) and (orientation:landscape){.arena-scene .announcer-banner{font-size:30px}.arena-scene .announcer-banner.is-big{font-size:42px}}

/* Damage numbers: chunky cartoon digits that pop, bounce and arc away (driven by WAAPI in combat-fx.js). */
.arena-scene .damage-number.fx-float{position:absolute;left:50%;top:10%;z-index:17;display:block;width:max-content;text-align:center;white-space:nowrap;pointer-events:none;opacity:0;animation:none;font:400 27px/1 var(--fx-display);letter-spacing:.5px;color:#fff3d2;text-shadow:var(--fx-outline)}
.arena-scene .damage-number.fx-float.for-player.is-damage{color:#ff7a57}
.arena-scene .damage-number.fx-float.heavy,.arena-scene .damage-number.fx-float.counter{font-size:30px}
.arena-scene .damage-number.fx-float.critical{font-size:35px;color:var(--ss-gold,#ffd24a)}
.arena-scene .damage-number.fx-float.for-player.critical{color:#ff9a3d}
.arena-scene .damage-number.fx-float .crit-tag{display:block;margin:0 auto 1px;font-size:13px;letter-spacing:2.5px;color:#fff;text-shadow:var(--fx-outline)}
.arena-scene .damage-number.fx-float.magic{color:#d9c2ff}
.arena-scene .damage-number.fx-float.taunt{color:#ffc4e6}
.arena-scene .damage-number.fx-float.heal{color:#8fe36a}
.arena-scene .damage-number.fx-float.miss{font-size:21px;color:#d8d2c4}
.arena-scene .damage-number.fx-float.guard{font-size:20px;color:#a9cce4}
.arena-scene .damage-number.fx-float.reload{font-size:18px;color:#f3e3bd}
.arena-scene .damage-number.fx-float.status.is-word{font-size:17px;color:#ffb37a}
.arena-scene .damage-number.fx-float.status.is-damage{font-size:22px;color:#ffb37a}
.arena-scene .damage-number.fx-float.hazard{font-size:23px;color:#ffc27a}
.arena-scene .damage-number.fx-float.armorbreak{font-size:16px;color:#bfe3f5}
.arena-scene .damage-number.fx-float.enrage{font-size:18px;color:#ff9e6b}
@media(max-width:380px){.arena-scene .damage-number.fx-float{font-size:24px}.arena-scene .damage-number.fx-float.critical{font-size:31px}}

/* Crowd: the stands (.crowd-layer from the battle view) bounce and brighten, the crowd meter pops, confetti and laurel leaves fly. */
.arena-scene.crowd-cheer .crowd-layer{animation:crowd-cheer .45s ease-in-out 2;filter:brightness(1.2) saturate(1.2)}
.arena-scene.crowd-cheer .crowd-hud{animation:crowd-hud-pop .45s ease-out 2}
.arena-scene .fx-confetti{position:absolute;z-index:7;width:8px;height:5px;border-radius:1px;background:var(--fx-color,#ffd24a);box-shadow:0 0 0 1px #2b170966;pointer-events:none;opacity:0}
.arena-scene .fx-confetti.is-leaf{width:12px;height:6px;border-radius:0 100% 0 100%;background:#74b43f;box-shadow:inset 0 0 0 1px #2d5a18}
.arena-scene .fx-confetti.is-tomato{z-index:5;width:13px;height:12px;border-radius:50%;background:radial-gradient(circle at 34% 32%,#ff9a78 0 16%,#e0452f 42%,#a52a1a);box-shadow:0 0 0 1.5px var(--fx-ink)}
.arena-scene.crowd-boo .crowd-layer{filter:brightness(.78) saturate(.7)}
.arena-scene.crowd-boo .crowd-hud{animation:crowd-hud-boo .3s ease-in-out 3}
@keyframes crowd-hud-boo{0%,100%{translate:0 0}30%{translate:-3px 0}70%{translate:3px 0}}
@keyframes crowd-cheer{0%,100%{translate:0 0}35%{translate:0 -5px}65%{translate:0 -2px}}
@keyframes crowd-hud-pop{0%,100%{scale:1;filter:none}40%{scale:1.14;filter:brightness(1.35) drop-shadow(0 0 6px #ffd24a)}}

/* The fight is decided: the rival's "Next:" chip and the stance / retreat tools fade before the repaint drops them. */
.arena-scene.fight-over .rival-intent,.arena-scene.fight-over .stage-tools .stance-chip,.arena-scene.fight-over .stage-tools .retreat{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,visibility 0s .2s}

/* Verdict and knockout extras. */
.arena-scene .fx-thumb{position:absolute;z-index:15;width:66px;height:66px;pointer-events:none;opacity:0;filter:drop-shadow(0 3px 0 #2b1709) drop-shadow(0 6px 8px #0007)}
.arena-scene .fx-thumb svg{display:block;width:100%;height:100%}
.arena-scene .fx-ko{position:absolute;z-index:16;padding:10px 16px;pointer-events:none;opacity:0;font:400 44px/1 var(--fx-display);letter-spacing:1px;color:var(--ss-gold,#ffd24a);text-shadow:var(--fx-outline-big);isolation:isolate}
.arena-scene .fx-ko::before,.arena-scene .fx-ko::after{content:'';position:absolute;z-index:-1;clip-path:polygon(50% 0,61% 22%,85% 6%,78% 33%,100% 40%,80% 55%,96% 80%,68% 72%,60% 100%,48% 78%,30% 97%,28% 70%,2% 78%,18% 54%,0 35%,24% 31%,15% 6%,40% 22%)}
.arena-scene .fx-ko::before{inset:-16px -22px;background:var(--fx-ink)}
.arena-scene .fx-ko::after{inset:-10px -15px;background:#e0452f}
.arena-scene .fx-star{position:absolute;z-index:15;width:21px;height:21px;pointer-events:none;opacity:0}
.arena-scene .fx-star svg{display:block;width:100%;height:100%}

/* Spells and impacts: the particle canvas (fx-particles.js) sits over the fighters and under the ticker, HUD, bubbles and banners.
   Rune circles and scorch marks lie on the sand behind the fighters (first in .battle-world, so the camera carries them);
   veils (meteor dusk, lightning flash) tint the whole arena. */
.arena-scene>.fx-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;display:block}
.arena-scene .fx-rune,.arena-scene .fx-decal{position:absolute;z-index:1;pointer-events:none;opacity:0;border-radius:50%}
.arena-scene .fx-rune{background:radial-gradient(closest-side,var(--fx-glow) 0,var(--fx-glow) 35%,transparent 100%)}
.arena-scene .fx-rune>svg{display:block;width:100%;height:100%;overflow:visible}
.arena-scene .fx-decal.is-scorch{background:radial-gradient(closest-side,#1c0d06e0,#2e1509b8 38%,#5a260d5c 68%,transparent)}
.arena-scene .fx-decal.is-crater{background:radial-gradient(closest-side,#0e0604f2,#24100ae0 36%,#ff7a2a8c 54%,#9a3d1266 66%,#5a260d33 82%,transparent)}
.arena-scene .fx-decal.is-frost{background:radial-gradient(closest-side,#f6feffe6,#c8f2ffc0 40%,#86d6ff66 70%,transparent)}
.arena-scene .fx-decal.is-venom{background:radial-gradient(closest-side,#35761bd9,#62b52ab3 42%,#9adf4055 72%,transparent)}
.arena-scene .battle-world>.fx-rune,.arena-scene .battle-world>.fx-decal{z-index:auto}
.arena-scene .fx-decal.is-blood{border-radius:0}
/* Legend talent moves: a crack in the sand (titan slam, earthshaker), an arcane scorch, the thunderstorm's black sky. */
.arena-scene .fx-decal.is-crack{border-radius:0}
.arena-scene .fx-decal.is-crack>svg{display:block;width:100%;height:100%;overflow:visible}
.arena-scene .fx-decal.is-arcane{background:radial-gradient(closest-side,#2a0f4ad9,#5a2a9ab0 36%,#b07cff66 62%,#d9b8ff22 82%,transparent)}
.arena-scene .fx-veil.is-storm{background:linear-gradient(180deg,#07091ae6 0,#0e1330c4 32%,#161c3ea6 62%,#161c3e80 100%)}
/* War cry's battle fury while the status lasts (combat-fx sets .is-furious at each paint): a red-hot glow and a crown of
   cartoon flames behind the fighter, flickering (still with motion off). */
.arena-scene .fighter-sprite.is-furious::before,.arena-scene .fighter-sprite.is-furious::after{content:'';position:absolute;z-index:-1;pointer-events:none;transform-origin:50% 100%}
.arena-scene .fighter-sprite.is-furious::before{left:12%;right:12%;top:10%;bottom:0;border-radius:50%;background:radial-gradient(ellipse 50% 56% at 50% 60%,#ffc46acc 0,#ff6a2ab0 24%,#ff3a1a70 48%,#c0150a2a 68%,transparent 74%)}
.arena-scene .fighter-sprite.is-furious::after{left:17%;right:17%;top:2%;bottom:2%;background:linear-gradient(0deg,#e8200fcc 0,#ff4a18d0 30%,#ff8a2ac0 62%,#ffc04aa0 84%,#ffe68a70);
 clip-path:polygon(50% 0,58% 14%,66% 2%,72% 24%,86% 12%,84% 38%,98% 34%,90% 58%,100% 72%,84% 86%,74% 100%,26% 100%,16% 86%,0 72%,10% 58%,2% 34%,16% 38%,14% 12%,28% 24%,34% 2%,42% 14%)}
html:not([data-motion="off"]) .arena-scene .fighter-sprite.is-furious::before{animation:fury-aura .9s ease-in-out infinite}
html:not([data-motion="off"]) .arena-scene .fighter-sprite.is-furious::after{animation:fury-flame .5s ease-in-out infinite alternate}
@keyframes fury-aura{0%,100%{opacity:.75;transform:scale(.96,.94)}50%{opacity:1;transform:scale(1.04,1.07)}}
@keyframes fury-flame{0%{opacity:.8;transform:scale(1,.94) skewX(-3deg)}100%{opacity:1;transform:scale(1.06,1.06) skewX(3deg)}}
.arena-scene .fx-decal.is-blood>svg{display:block;width:100%;height:100%}
/* ARMOR SHATTERED!: the popped helmet (a copy of the rig's) flying off and lying on the sand until the repaint. */
.arena-scene .battle-world>.fx-helmet{position:absolute;width:1px;height:1px;overflow:visible;pointer-events:none;transform-origin:0 0}
.arena-scene .fx-veil{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0}
.arena-scene .fx-veil.is-dusk{background:radial-gradient(ellipse 90% 70% at 50% 35%,#1b0f2e55,#0c0718b0)}
.arena-scene .fx-veil.is-flash{background:radial-gradient(ellipse at 50% 45%,#fbf6ff,#d9c6ffcc 60%,#b99cff99)}
html[data-motion="off"] .arena-scene>.fx-canvas,html[data-motion="off"] .arena-scene .fx-rune,html[data-motion="off"] .arena-scene .fx-decal,html[data-motion="off"] .arena-scene .fx-helmet,html[data-motion="off"] .arena-scene .fx-veil{display:none}

html[data-motion="off"] .arena-scene .speech-bubble,html[data-motion="off"] .arena-scene .announcer-banner,html[data-motion="off"] .arena-scene .fx-confetti,html[data-motion="off"] .arena-scene .fx-thumb,html[data-motion="off"] .arena-scene .fx-ko,html[data-motion="off"] .arena-scene .fx-star{display:none}
html[data-motion="off"] .arena-scene.crowd-cheer .crowd-layer,html[data-motion="off"] .arena-scene.crowd-boo .crowd-layer{filter:none}
html[data-motion="off"] .arena-scene.crowd-boo .crowd-hud{animation:none}

/* ---------- 10.0 champions, tricks and surprises ---------- */
/* The telegraphed trick's prop in the rival's hand (fighter-rig.js .rig-trick while data-windup names the trick). */
.combat-rig .rig-trick{display:none}
.combat-rig[data-windup] .rig-trick{display:inline}
.combat-rig:is([data-windup="net"],[data-windup="draught"],[data-windup="firepots"],[data-windup="poison"],[data-windup="bribe"],[data-windup="smoke"],[data-windup="sand"],[data-windup="meteor"],[data-windup="volley"],[data-windup="beast"],[data-windup="thumbsdown"],[data-windup="praetorians"]) .rig-melee{display:none}
.combat-rig:is([data-windup="meteor"],[data-windup="praetorians"]) .rig-pointing-finger,.combat-rig[data-windup="volley"] :is(.rig-ranged,.rig-open-hand){display:inline}
.combat-rig[data-windup="volley"] .rig-shield{display:none}
/* Evading (a champion's vanishing smoke, a smoke bomb): half there. */
.combat-rig[data-status~="evade"]{opacity:.5}
/* The telegraphed trick's sign over the champion's shoulder (painted while b.boss.next is set; pops in with the telegraph). */
.arena-scene .fx-trick-badge{position:absolute;left:80%;top:5%;z-index:3;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 36% 30%,#fff6c8,#ffd24a 45%,#e0452f);border:2.5px solid var(--fx-ink);box-shadow:0 3px 0 var(--fx-ink),0 6px 12px #0006;color:var(--fx-ink);translate:-50% -50%;scale:var(--cam-inv,1);pointer-events:none}
.arena-scene .fx-trick-badge>i{display:grid;place-items:center}
.arena-scene .fx-trick-badge .icon{display:block;width:23px;height:23px;stroke-width:2.6}
.arena-scene .fx-trick-badge>b{position:absolute;right:-9px;top:-13px;font:400 24px/1 var(--fx-display);color:#fff3c4;text-shadow:var(--fx-outline)}
.arena-scene .fighter-sprite.enemy.facing-flipped .fx-trick-badge{left:20%}
html:not([data-motion="off"]) .arena-scene .fx-trick-badge{animation:fx-badge .8s ease-in-out 4}
@keyframes fx-badge{0%,100%{transform:none}50%{transform:scale(1.14) rotate(-7deg)}}
/* Sky fire's target on the telegraphed space. */
.arena-scene .battle-world>.fx-mark{position:absolute;bottom:0;z-index:1;width:9%;min-width:44px;translate:-50% 45%;pointer-events:none}
.arena-scene .fx-mark>svg{display:block;width:100%;height:auto;overflow:visible}
html:not([data-motion="off"]) .arena-scene .fx-mark>svg{animation:fx-mark .9s ease-in-out 5}
@keyframes fx-mark{50%{transform:scale(1.14);opacity:.75}}
/* The lion: by a mauled fighter, prowling loose, or bounding out of the beast gate. */
.arena-scene .battle-world>.fx-beast{position:absolute;translate:-50% -100%;transform-origin:50% 100%;pointer-events:none}
.arena-scene .fx-beast>svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 3px 0 #2b170955)}
.arena-scene .fx-beast.is-flipped>svg{transform:scaleX(-1)}
.arena-scene .fx-beast .lion-roar,.arena-scene .fx-beast.is-roaring .lion-grin{display:none}
.arena-scene .fx-beast.is-roaring .lion-roar{display:inline}
.arena-scene .fx-beast .lion-tail{transform-origin:27px 52px}
html:not([data-motion="off"]) .arena-scene .fx-beast .lion-tail{animation:fx-tail 1.1s ease-in-out 4}
@keyframes fx-tail{50%{transform:rotate(-16deg)}}
/* The Emperor's amphora lying on its space (and in flight), a net in flight, the planted tower shield, spikes springing. */
.arena-scene .battle-world>.fx-amphora{position:absolute;bottom:.5%;height:22%;aspect-ratio:44/66;translate:-50% 0;pointer-events:none;filter:drop-shadow(0 0 6px #ffd24acc)}
.arena-scene .battle-world>:is(.fx-amphora-fly,.fx-tower,.fx-spikes){position:absolute;translate:-50% -100%;transform-origin:50% 100%;pointer-events:none}
.arena-scene .battle-world>.fx-net{position:absolute;translate:-50% -50%;pointer-events:none}
.arena-scene .battle-world>:is(.fx-amphora,.fx-amphora-fly,.fx-net,.fx-tower,.fx-spikes,.fx-flask)>svg{display:block;width:100%;height:100%;overflow:visible}
/* 10.10: an emptied potion flask flung over the shoulder */
.arena-scene .battle-world>.fx-flask{position:absolute;z-index:4;pointer-events:none;will-change:transform}
/* Spike traps waiting on their spaces (the hazard tiles of b.hazardKind 'spikes'). */
.arena-scene .ember-tile.is-spikes{background:radial-gradient(ellipse at 50% 92%,#2b1709a0,#5a3a2a55 55%,transparent 74%);border-bottom-color:#9aa4ad}
.arena-scene .ember-tile.is-spikes>.icon{display:none}
.arena-scene .ember-tile>.fx-spike-tile{position:absolute;left:50%;bottom:1px;width:36px;translate:-50% 0;scale:var(--cam-inv,1);transform-origin:50% 100%}
.arena-scene .fx-spike-tile>svg{display:block;width:100%;height:auto}
/* The sandstorm: a sandy haze with blowing streaks over the arena (under the HUD, bubbles and banners). */
.arena-scene>.fx-sandstorm{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden;background:linear-gradient(180deg,#f0d49a30,#dcae6a5c 55%,#c8904a80)}
.arena-scene>.fx-sandstorm::before,.arena-scene>.fx-sandstorm::after{content:'';position:absolute;top:0;bottom:0;left:-240px;right:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='120'%3E%3Cg stroke='%23f6e0b4' stroke-linecap='round' opacity='.7'%3E%3Cpath d='M8 14h46M120 30h60M40 58h38M150 76h54M10 96h44M96 108h36' stroke-width='2.4'/%3E%3Cpath d='M70 20h22M200 46h26M110 64h18M190 100h24' stroke-width='1.4'/%3E%3C/g%3E%3C/svg%3E") 0 0/240px 120px}
.arena-scene>.fx-sandstorm::after{opacity:.55;background-size:180px 90px;top:-30px}
html:not([data-motion="off"]) .arena-scene>.fx-sandstorm::before{animation:fx-sand .9s linear infinite;will-change:transform}
html:not([data-motion="off"]) .arena-scene>.fx-sandstorm::after{animation:fx-sand 1.5s linear infinite;will-change:transform}
@keyframes fx-sand{to{transform:translateX(240px)}}
/* A shout from the stands (a rival's mother), and the FOILED! / SMASHED! calls. */
.arena-scene .speech-bubble.speaker-stands{--bubble-bg:#ffe6ee;background:var(--bubble-bg);max-width:min(220px,62vw)}
.arena-scene .speech-bubble.speaker-stands::after{border-top-color:#f0c4d4}
.arena-scene .damage-number.fx-float.trick{font-size:22px;letter-spacing:1px;color:#ffd24a}
html[data-motion="off"] .arena-scene :is(.fx-net,.fx-tower,.fx-spikes,.fx-amphora-fly,.fx-flask){display:none}
.arena-scene .fighter-sprite.enemy .fx-trick-badge.is-front{left:20%}
.arena-scene .fighter-sprite.enemy.facing-flipped .fx-trick-badge.is-front{left:80%}
/* While a turn plays out, the HUD's telegraph / surprise banners step aside for the arena's own calls (they return with the repaint). */
.arena-scene.turn-animating .battle-hud .stage-banners{opacity:0;transition:opacity .15s}
/* 10.1: the final blow in slow motion: the scene darkens at the edges (over the fighters, under the particles and labels). */
.arena-scene>.fx-slowmo{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:radial-gradient(ellipse 72% 62% at 50% 50%,#0000 42%,#12081cb0 100%)}
html[data-motion="off"] .arena-scene>.fx-slowmo{display:none}
/* 10.1: comic finishers — props in the world (the camera carries them), comic words, the reduced-motion card. */
.arena-scene .battle-world>:is(.fx-catapult,.fx-pin){position:absolute;translate:-50% -100%;transform-origin:50% 100%;pointer-events:none;z-index:1}
.arena-scene .battle-world>.fx-pigeon{position:absolute;translate:-50% -50%;pointer-events:none;z-index:3}
.arena-scene .battle-world>:is(.fx-catapult,.fx-pin,.fx-pigeon)>svg{display:block;width:100%;height:100%;overflow:visible}
.arena-scene .battle-world>:is(.fx-catapult,.fx-pigeon).is-flipped>svg{transform:scaleX(-1)}
.arena-scene .fx-grape{position:absolute;z-index:6;width:14px;height:17px;pointer-events:none}.arena-scene .fx-grape>svg{display:block;width:100%;height:100%}
.arena-scene .fx-pow{white-space:nowrap}
.combat-rig[data-prop="sandal"] .rig-melee{display:none}
.arena-scene .fx-finisher-card{position:absolute;left:50%;top:38%;z-index:18;transform:translate(-50%,-50%) rotate(-2deg);display:grid;gap:4px;width:min(300px,82%);padding:12px 16px 14px;text-align:center;pointer-events:none;background:var(--ss-parch,#f3e3bd);color:var(--ss-parch-ink,#3a220f);border:3px solid var(--fx-ink,#2b1709);border-radius:14px;box-shadow:0 4px 0 #2b1709,0 10px 22px #0008}
.arena-scene .fx-finisher-card>b{font:400 26px/1.05 var(--fx-display,'Lilita One',sans-serif);color:#b3122a;letter-spacing:.5px}
.arena-scene .fx-finisher-card>small{font:600 14px/1.3 'DM Sans',system-ui,sans-serif}
html[data-motion="off"] .arena-scene .fx-finisher-card{display:grid}
.arena-scene .fx-box-cameo{position:absolute;z-index:3;pointer-events:none;transform-origin:50% 100%}.arena-scene .fx-box-cameo>svg{display:block;width:100%;height:100%;overflow:visible}
/* 10.1: the Emperor's fight — praetorians popping up in the front rows, the coronation's laurel, its reduced-motion card. */
.arena-scene>.fx-praetorian{position:absolute;z-index:3;pointer-events:none;transform-origin:50% 100%;opacity:0;filter:drop-shadow(0 2px 0 #2b170980)}
.arena-scene>.fx-praetorian>svg{display:block;width:100%;height:100%;overflow:visible}.arena-scene>.fx-praetorian.is-flipped>svg{transform:scaleX(-1)}
.arena-scene>.fx-laurel{position:absolute;z-index:6;pointer-events:none;opacity:0;filter:drop-shadow(0 0 8px #ffd24acc) drop-shadow(0 2px 0 #2b1709)}
.arena-scene>.fx-laurel>svg{display:block;width:100%;height:100%;overflow:visible}
.arena-scene .fx-finisher-card.is-coronation>b{color:#b8741a}
/* 10.1 coronation: the crowned rig's own laurel waits until the flying wreath lands on the head */
.arena-scene.crowning .rig-laurel{visibility:hidden}
/* 10.4: before the Emperor's intro plays he sits in his box (arena-stage.js), so his fighter waits off the sand until it starts. */
.arena-scene.intro-pending .fighter-sprite.enemy.is-emperor{visibility:hidden}
/* 10.11 a trap arena's spike pits (engine battle.traps), for the whole fight: a dark hole in the sand, its spikes up. */
.arena-scene .trap-tile{position:absolute;bottom:2px;width:7.3%;height:26px;transform:translateX(-50%);pointer-events:none;background:radial-gradient(ellipse at 50% 88%,#1a0d05d0,#3a241580 50%,transparent 72%);border-bottom:2px solid #7a6048}
.arena-scene .trap-tile>i{position:absolute;left:50%;bottom:2px;width:32px;translate:-50% 0;scale:var(--cam-inv,1);transform-origin:50% 100%}
.arena-scene .trap-tile svg{display:block;width:100%;height:auto;overflow:visible}
/* 10.11 gory: the rival's weapon arm, taken by the knockout blow, stays off on the result screen */
.fighter-sprite.maimed .combat-rig [data-joint="forearm"]{visibility:hidden}