/* One illustrated effects language: warm metal, tinted glass, soft ground contact.
   These effects are decorative; the controls and game clock never wait for them. */
.arena-field {
  --fx-gold:#dec78c;
  --fx-mint:#b4ceb8;
  --fx-ink:#254540;
  --fx-plum:#967da2;
}
:root[data-theme='neon'] .arena-field { --fx-gold:#e1b9f2; --fx-mint:#a7efd7; --fx-ink:#283652; --fx-plum:#886caf; }
:root[data-theme='woodland'] .arena-field { --fx-gold:#dfc886; --fx-mint:#bfce94; --fx-ink:#364d35; --fx-plum:#99819a; }
.arena-mark { display:block; width:100%; height:auto; overflow:visible; }
.arena-bank .arena-mark,.arena-deck .arena-mark { width:18px; opacity:.62; }
.arena-purse i { display:inline-block; width:14px; height:14px; vertical-align:-2px; }
.arena-edit-mark .arena-mark { width:12px; }
.arena-socket .arena-performer { filter:drop-shadow(0 5px 3px #020f17a6); }
.arena-projector { background:linear-gradient(transparent 40%,#b8dcc21a); }
.arena-card-anchor { box-shadow:0 2px 0 #021319,0 5px 8px #02151980,0 0 16px #8acaab13; }
.is-current .arena-card-anchor { border-color:#afc49c99; box-shadow:0 3px 0 #04131c,0 0 17px #bcd99624; }
.arena-effect {
  width:48px;
  height:auto;
  color:var(--fx-gold);
  text-shadow:none;
  isolation:isolate;
  will-change:transform,opacity;
  pointer-events:none;
}
.arena-effect-art { display:block; position:relative; z-index:1; line-height:0; filter:drop-shadow(0 4px 3px #03121780); }
.arena-effect-shadow {
  position:absolute;
  left:10%; right:10%; bottom:-9px;
  height:15px;
  border-radius:50%;
  background:radial-gradient(ellipse,#00111675,transparent 72%);
  opacity:.55;
  transform:scaleY(.55);
}
.arena-effect.arena-coin-flight { width:30px; }
.arena-effect.arena-coin-reach { width:25px; }
.arena-coin-reach .arena-effect-art { opacity:.46; filter:drop-shadow(0 2px 3px #d9c89633); }
.arena-coin-flight .arena-mark { animation:arena-metal-turn var(--fx-duration,1050ms) ease-in-out both; }
.arena-effect.arena-card-flight { width:40px; }
.arena-effect.arena-traveller { width:80px; filter:none; }
.arena-traveller .arena-effect-art { filter:drop-shadow(-5px 3px 3px #000b1666); }
.arena-traveller .performer-platform { opacity:.18; }
.arena-traveller .performer-cloak { animation:arena-cloak-travel 1320ms ease-in-out both; }
.arena-effect.arena-coup-strike { width:62px; }
.arena-coup-strike .arena-effect-art { transform:rotate(20deg); filter:drop-shadow(0 3px 2px #000d17aa); }
.arena-effect.arena-block-shield {
  display:block;
  width:72px; height:auto;
  border:0; border-radius:0;
  background:none; box-shadow:none;
}
.arena-block-shield .arena-effect-art { filter:drop-shadow(0 4px 4px #05121a99) drop-shadow(0 0 7px #dac6eb29); }
.arena-block-shield .arena-mark-fan { transform-origin:50% 83%; animation:arena-fan-open 650ms cubic-bezier(.2,.8,.25,1) both; }
.arena-effect.arena-challenge { width:52px; }
.arena-effect.arena-proof,.arena-effect.arena-bluff { width:60px; }
.arena-effect.arena-result-blocked,.arena-effect.arena-result-bluff,.arena-effect.arena-result-miss { width:51px; }
.arena-effect.arena-lost-ghost { z-index:2; }
.arena-lost-ghost .arena-effect-shadow { display:none; }
.arena-lost-ghost .arena-effect-art { filter:drop-shadow(0 0 6px #d8cab533); }
.arena-lost-ghost .performer-platform { opacity:0; }
.arena-effect.arena-shatter { width:95px; }
.arena-shatter .arena-effect-shadow { display:none; }
.arena-shatter .arena-effect-art { filter:drop-shadow(0 0 3px #e4bb8544); }
.fx-shard { fill:#d8c295; stroke:#f4dfb7; stroke-width:.7; transform-origin:32px 32px; animation:arena-fragment 1350ms cubic-bezier(.13,.64,.26,1) both; }
.fx-shard-1 { --shard-x:-13px; --shard-y:-14px; --shard-r:-20deg; }
.fx-shard-2 { --shard-x:11px; --shard-y:-17px; --shard-r:27deg; }
.fx-shard-3 { --shard-x:17px; --shard-y:6px; --shard-r:42deg; }
.fx-shard-4 { --shard-x:7px; --shard-y:18px; --shard-r:-14deg; }
.fx-shard-5 { --shard-x:-17px; --shard-y:14px; --shard-r:32deg; }
.arena-impact-ring {
  position:absolute;
  width:76px; height:25px;
  border:1px solid #d5c59499;
  border-radius:50%;
  box-shadow:0 0 8px #c6dcb811,inset 0 0 8px #c6dcb811;
  pointer-events:none;
}
.arena-effect.arena-victory { width:88px; }
.arena-victory .arena-effect-art { filter:drop-shadow(0 6px 4px #06121999) drop-shadow(0 0 12px #e0c58c33); }
@keyframes arena-metal-turn {
  0% { transform:perspective(100px) rotateY(-45deg); }
  42% { transform:perspective(100px) rotateY(38deg); }
  78%,100% { transform:perspective(100px) rotateY(0); }
}
@keyframes arena-fan-open {
  0% { transform:scaleX(.24) rotate(-17deg); }
  68% { transform:scaleX(1.04) rotate(2deg); }
  100% { transform:scaleX(1) rotate(0); }
}
@keyframes arena-cloak-travel {
  0%,100% { transform:skewX(0); }
  28% { transform:skewX(-9deg); }
  64% { transform:skewX(4deg); }
}
@keyframes arena-fragment {
  0%,9% { opacity:0; transform:translate(0,0) scale(.8); }
  21% { opacity:.95; }
  74% { opacity:.5; }
  100% { opacity:0; transform:translate(var(--shard-x),var(--shard-y)) rotate(var(--shard-r)) scale(.75); }
}
@media(max-width:760px){
  .arena-effect.arena-traveller { width:56px; }
  .arena-effect.arena-block-shield { width:56px; }
  .arena-effect.arena-coup-strike { width:48px; }
  .arena-effect.arena-shatter { width:70px; }
  .arena-effect.arena-victory { width:66px; }
  .arena-impact-ring { width:57px; height:19px; }
  .arena-bank .arena-mark,.arena-deck .arena-mark { width:14px; }
  .arena-purse i { width:11px; height:11px; }
}
@media(prefers-reduced-motion:reduce){
  .arena-effect,.arena-impact-ring { display:none!important; }
  .arena-effect * { animation:none!important; }
}
:root[data-motion='reduced'] .arena-effect,:root[data-motion='reduced'] .arena-impact-ring { display:none!important; }
:root[data-motion='reduced'] .arena-effect * { animation:none!important; }

/* Stage changes get one restrained bloom. No endless spotlight movement. */
.arena-field[data-stage='duel'] .arena-stage-reveal,
.arena-field[data-stage='winner'] .arena-stage-reveal { animation:arena-stage-bloom 1650ms ease-out both; }
.arena-field[data-stage='winner'] .arena-core-crown { animation:arena-crown-arrive 1350ms cubic-bezier(.2,.7,.3,1) both; }
@keyframes arena-stage-bloom { 0% { opacity:0; transform:scale(.94); } 32% { opacity:.85; } 100% { opacity:0; transform:scale(1.06); } }
@keyframes arena-crown-arrive { 0% { opacity:0; transform:translateY(8px) scale(.87); } 65% { opacity:1; transform:translateY(-1px) scale(1.015); } 100% { opacity:1; transform:translateY(0) scale(1); } }
@media(prefers-reduced-motion:reduce){.arena-stage-reveal,.arena-core-crown { animation:none!important; }}
:root[data-motion='reduced'] .arena-stage-reveal,:root[data-motion='reduced'] .arena-core-crown { animation:none!important; }