.battle-pocket-shell.arena-mode {
  position: relative;
  background:
    linear-gradient(170deg, #09091a 0%, #07070e 55%, #0c0918 100%),
    radial-gradient(ellipse 60% 40% at 50% 0%,  rgba(80,100,180,.12) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 20% 100%, rgba(80,220,160,.06) 0%, transparent 60%),
    radial-gradient(ellipse 40% 40% at 80% 80%,  rgba(180,60,60,.06) 0%, transparent 60%);
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04),
    0 30px 80px rgba(0,0,0,.8),
    inset 0 1px 0 rgba(255,255,255,.06);
  transition: box-shadow .6s;
  min-height: 520px;
}
.battle-pocket-shell.arena-mode.arena-win-glow {
  box-shadow:
    0 0 0 2px rgba(80,220,160,.3),
    0 0 80px rgba(80,220,160,.15),
    0 30px 80px rgba(0,0,0,.8);
}
.battle-pocket-shell.arena-mode.arena-lose-glow {
  box-shadow:
    0 0 0 2px rgba(220,80,80,.3),
    0 0 80px rgba(220,80,80,.12),
    0 30px 80px rgba(0,0,0,.8);
}
@keyframes arena-shake {
  0%,100% { transform: translate(0,0) rotate(0); }
  10%  { transform: translate(-5px,-3px) rotate(-.5deg); }
  20%  { transform: translate( 5px, 3px) rotate( .5deg); }
  30%  { transform: translate(-4px, 2px) rotate(-.3deg); }
  40%  { transform: translate( 4px,-2px) rotate( .3deg); }
  50%  { transform: translate(-3px, 1px); }
  60%  { transform: translate( 3px,-1px); }
  70%  { transform: translate(-2px, 1px); }
}
.battle-pocket-shell.arena-mode.arena-shake {
  animation: arena-shake .38s cubic-bezier(.36,.07,.19,.97) both;
}
.arena-bg-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: var(--z-arena-base);
  background-image:
    linear-gradient(rgba(80,220,160,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(80,220,160,.022) 1px, transparent 1px);
  background-size: 52px 52px;
  animation: arena-grid-scroll 18s linear infinite;
  border-radius: inherit;
}
@keyframes arena-grid-scroll {
  to { background-position: 0 52px, 52px 0; }
}
.arena-bg-scanlines {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: var(--z-arena-base);
  border-radius: inherit;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(255,255,255,.008) 2px,
    rgba(255,255,255,.008) 4px
  );
  animation: arena-scanline 8s linear infinite;
}
@keyframes arena-scanline {
  0%   { background-position: 0 0; }
  100% { background-position: 0 300px; }
}
.arena-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: var(--z-arena-base);
}
.arena-orb-1 {
  width: 320px; height: 280px;
  background: rgba(80,220,160,.07);
  top: -80px; left: -80px;
  animation: orb1 9s ease-in-out infinite alternate;
}
.arena-orb-2 {
  width: 280px; height: 260px;
  background: rgba(60,164,240,.08);
  bottom: -60px; right: -60px;
  animation: orb2 11s ease-in-out infinite alternate;
}
.arena-orb-3 {
  width: 220px; height: 220px;
  background: rgba(220,80,80,.06);
  top: 40%; right: -50px;
  animation: orb3 13s ease-in-out infinite alternate;
}
.arena-orb-4 {
  width: 200px; height: 160px;
  background: rgba(60,80,255,.05);
  bottom: 20%; left: -40px;
  animation: orb4 15s ease-in-out infinite alternate;
}
@keyframes orb1 { to { transform: translate(40px,30px)  scale(1.15); } }
@keyframes orb2 { to { transform: translate(-30px,20px) scale(1.10); } }
@keyframes orb3 { to { transform: translate(-20px,30px) scale(1.20); } }
@keyframes orb4 { to { transform: translate(30px,-20px) scale(1.10); } }
.arena-vignette {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: var(--z-arena-content);
  border-radius: inherit;
  background: radial-gradient(ellipse at center, transparent 25%, rgba(5,5,10,.85) 100%);
}
#arena-fx-canvas {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: var(--z-arena-effects);
  width: 100%;
  height: 100%;
}
.battle-pocket-shell.arena-mode .battle-pocket-head {
  position: relative;
  z-index: var(--z-arena-above);
  background: rgba(255,255,255,.02);
  border-bottom: 1px solid rgba(255,255,255,.05);
  backdrop-filter: blur(6px);
}
.battle-pocket-shell.arena-mode .battle-pocket-round {
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .58rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,200,0,.55);
  transition: color .3s;
}
.battle-pocket-shell.arena-mode .battle-pocket-round.round-bump {
  animation: round-bump .4s ease;
}
@keyframes round-bump {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.5); color: var(--arena-gold); }
  100% { transform: scale(1); }
}
.battle-pocket-shell.arena-mode .battle-pocket-turn {
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .6rem;
  letter-spacing: .12em;
  color: rgba(255,255,255,.3);
}
.battle-pocket-shell.arena-mode .bko-wrap {
  position: relative;
  z-index: var(--z-arena-above);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .5rem 1.5rem;
  gap: 1rem;
  background: rgba(0,0,0,.25);
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.arena-pip {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.08);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.02);
  transition: border-color .3s;
}
.arena-pip::before {
  content: '';
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: transparent;
  transition: all .4s;
}
.arena-pip.player.filled {
  border-color: var(--arena-green);
  background: rgba(80,220,160,.06);
}
.arena-pip.player.filled::before {
  background: var(--arena-green);
  box-shadow: 0 0 10px var(--arena-green), 0 0 20px rgba(80,220,160,.4);
}
.arena-pip.enemy.filled {
  border-color: var(--arena-red);
  background: rgba(220,80,80,.06);
}
.arena-pip.enemy.filled::before {
  background: var(--arena-red);
  box-shadow: 0 0 10px var(--arena-red), 0 0 20px rgba(220,80,80,.4);
}
@keyframes pip-pop {
  0%   { transform: scale(0) rotate(-180deg); opacity: 0; }
  50%  { transform: scale(1.8) rotate(15deg);  opacity: 1; }
  70%  { transform: scale(0.8) rotate(-5deg); }
  85%  { transform: scale(1.1); }
  100% { transform: scale(1) rotate(0); }
}
@keyframes pip-ring-player {
  0%   { box-shadow: 0 0 0 0 rgba(80,220,160,1); }
  100% { box-shadow: 0 0 0 18px rgba(80,220,160,0); }
}
@keyframes pip-ring-enemy {
  0%   { box-shadow: 0 0 0 0 rgba(220,80,80,1); }
  100% { box-shadow: 0 0 0 18px rgba(220,80,80,0); }
}
.arena-pip.player.pip-pop          { animation: pip-ring-player .7s ease-out; }
.arena-pip.player.pip-pop::before  { animation: pip-pop .55s cubic-bezier(.34,1.56,.64,1) forwards; }
.arena-pip.enemy.pip-pop           { animation: pip-ring-enemy .7s ease-out; }
.arena-pip.enemy.pip-pop::before   { animation: pip-pop .55s cubic-bezier(.34,1.56,.64,1) forwards; }
.arena-vs-badge {
  font-family: var(--font-display, 'Bebas Neue', sans-serif);
  font-size: 1.1rem;
  color: rgba(255,255,255,.2);
  letter-spacing: .3em;
  border: 1px solid rgba(255,255,255,.07);
  padding: 3px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  text-shadow: 0 0 12px rgba(255,255,255,.1);
  white-space: nowrap;
}
.battle-pocket-shell.arena-mode .battle-pocket-board {
  position: relative;
  z-index: var(--z-arena-raised);
  flex: 1;
}
.battle-pocket-shell.arena-mode .battle-pocket-terrain {
  background: transparent !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-terrain > * {
  display: none !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-card {
  border-radius: 14px;
  position: relative;
  overflow: hidden;
  transition: box-shadow .3s;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card {
  background: linear-gradient(160deg, #0f3d2e 0%, #07201a 60%, #050f0d 100%);
  border: 1.5px solid rgba(80,220,160,.55);
  box-shadow: 0 8px 32px rgba(0,0,0,.6), inset 0 1px 0 rgba(80,220,160,.12);
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 0 24px rgba(80,220,160,.2), inset 0 1px 0 rgba(80,220,160,.2);
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card {
  background: linear-gradient(160deg, #3d0f0f 0%, #200707 60%, #0f0505 100%);
  border: 1.5px solid rgba(220,80,80,.55);
  box-shadow: 0 8px 32px rgba(0,0,0,.6), inset 0 1px 0 rgba(220,80,80,.12);
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 0 24px rgba(220,80,80,.2), inset 0 1px 0 rgba(220,80,80,.2);
}
.battle-pocket-shell.arena-mode .battle-pocket-card-shimmer {
  position: absolute;
  inset: 0;
  border-radius: 14px;
  pointer-events: none;
  background-size: 200% 100%;
  animation: arena-holo 3.5s ease infinite;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card-shimmer {
  background: linear-gradient(115deg,
    transparent 0%, transparent 25%,
    rgba(80,220,160,.05) 38%, rgba(120,255,190,.13) 50%,
    rgba(80,220,160,.05) 62%, transparent 75%, transparent 100%
  );
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card-shimmer {
  background: linear-gradient(115deg,
    transparent 0%, transparent 25%,
    rgba(220,80,80,.05) 38%, rgba(255,130,130,.13) 50%,
    rgba(220,80,80,.05) 62%, transparent 75%, transparent 100%
  );
}
@keyframes arena-holo {
  0%   { background-position: 200% 0%; }
  100% { background-position: -200% 0%; }
}
.arena-rarity-bar {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  border-radius: 14px 14px 0 0;
  pointer-events: none;
}
.battle-pocket-zone.player .arena-rarity-bar {
  background: linear-gradient(90deg, transparent, var(--arena-green), transparent);
}
.battle-pocket-zone.enemy .arena-rarity-bar {
  background: linear-gradient(90deg, transparent, var(--arena-red), transparent);
}
.battle-pocket-card.is-attacking {
  animation: card-attack-flash .28s ease-out;
}
@keyframes card-attack-flash {
  0%,100% { filter: brightness(1); }
  50%     { filter: brightness(1.6) saturate(1.4); }
}
.battle-pocket-card.is-hit {
  animation: card-hit-flash .3s ease-out;
}
@keyframes card-hit-flash {
  0%,100% { filter: brightness(1); }
  20%     { filter: brightness(2) saturate(.3); }
  60%     { filter: brightness(.6); }
}
.battle-pocket-card.is-ko {
  animation: card-ko-explode .7s ease-in forwards;
}
@keyframes card-ko-explode {
  0%   { opacity: 1; transform: scale(1); filter: brightness(1); }
  10%  { transform: scale(1.08); filter: brightness(2); }
  30%  { transform: scale(.92) rotate(4deg); filter: brightness(.5); }
  55%  { opacity: .5; transform: scale(.5) rotate(-12deg) translateY(8px); filter: brightness(0); }
  100% { opacity: 0; transform: scale(0) rotate(-30deg) translateY(30px); }
}
.battle-pocket-card.is-switching {
  animation: arena-card-flip-in .45s cubic-bezier(.34,1.2,.64,1) both;
}
@keyframes arena-card-flip-in {
  0%   { opacity: 0; transform: rotateY(-90deg) scale(.7); filter: brightness(2); }
  50%  { opacity: 1; filter: brightness(1.5); }
  75%  { transform: rotateY(8deg) scale(1.04); }
  100% { opacity: 1; transform: rotateY(0) scale(1); filter: brightness(1); }
}
.battle-pocket-shell.arena-mode .battle-pocket-card-bar {
  height: 5px;
  border-radius: 3px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
}
.battle-pocket-shell.arena-mode .battle-pocket-card-bar span {
  display: block;
  height: 100%;
  border-radius: 3px;
  transition: width .5s cubic-bezier(.34,1.2,.64,1), background .4s;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card-bar span {
  background: var(--arena-green);
  box-shadow: 0 0 6px rgba(80,220,160,.4);
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card-bar span {
  background: var(--arena-red);
  box-shadow: 0 0 6px rgba(220,80,80,.4);
}
.battle-pocket-shell.arena-mode .battle-pocket-hp-pill {
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .56rem;
  letter-spacing: .05em;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.8);
}
.arena-power-bar-wrap {
  position: relative;
  z-index: var(--z-arena-above);
  width: 100%;
  max-width: 340px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.arena-power-bar-track {
  width: 100%;
  height: 4px;
  border-radius: 4px;
  background: rgba(255,255,255,.05);
  position: relative;
}
.arena-power-bar-fill {
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--arena-green), rgba(80,220,160,.5));
  width: 50%;
  transition: width .6s cubic-bezier(.34,1.2,.64,1);
  position: relative;
}
.arena-power-bar-fill::after {
  content: '';
  position: absolute;
  right: -4px; top: -4px;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--arena-green);
  box-shadow: 0 0 8px var(--arena-green);
}
.arena-power-bar-labels {
  display: flex;
  justify-content: space-between;
  width: 100%;
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .5rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(255,255,255,.25);
}
.battle-pocket-shell.arena-mode .battle-action-pill,
.battle-pocket-shell.arena-mode .btn[data-battle-action] {
  position: relative;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem 1.1rem;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.65);
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .2s;
  overflow: hidden;
}
.battle-pocket-shell.arena-mode .battle-action-pill::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
  transition: left .5s;
}
.battle-pocket-shell.arena-mode .battle-action-pill:hover::before { left: 150%; }
.battle-pocket-shell.arena-mode .battle-action-pill:hover,
.battle-pocket-shell.arena-mode .btn[data-battle-action="standard"]:hover {
  border-color: rgba(80,220,160,.45);
  background: rgba(80,220,160,.07);
  color: var(--arena-green);
  box-shadow: 0 0 18px rgba(80,220,160,.12);
}
.battle-pocket-shell.arena-mode .btn[data-battle-action="signature"] {
  border-color: rgba(255,200,0,.35);
  color: var(--arena-gold);
  background: rgba(255,200,0,.04);
}
.battle-pocket-shell.arena-mode .btn[data-battle-action="signature"]:hover {
  border-color: rgba(255,200,0,.7);
  background: rgba(255,200,0,.08);
  box-shadow: 0 0 20px rgba(255,200,0,.15);
}
.battle-pocket-shell.arena-mode .btn[data-battle-action="special"] {
  border-color: rgba(96,196,255,.35);
  color: var(--arena-purple);
  background: rgba(96,196,255,.04);
}
.battle-pocket-shell.arena-mode .btn[data-battle-action="special"]:hover {
  border-color: rgba(96,196,255,.7);
  background: rgba(96,196,255,.08);
  box-shadow: 0 0 20px rgba(96,196,255,.15);
}
.battle-pocket-shell.arena-mode .btn[data-battle-action="clutch"] {
  border-color: rgba(255,153,0,.35);
  color: var(--arena-orange);
  background: rgba(255,153,0,.04);
}
.battle-pocket-shell.arena-mode .btn[data-battle-action="clutch"]:hover {
  border-color: rgba(255,153,0,.7);
  background: rgba(255,153,0,.08);
  box-shadow: 0 0 20px rgba(255,153,0,.15);
}
.battle-pocket-shell.arena-mode .battle-action-pill:disabled,
.battle-pocket-shell.arena-mode .btn[data-battle-action]:disabled {
  opacity: .22;
  cursor: not-allowed;
  pointer-events: none;
}
.battle-pocket-shell.arena-mode .battle-log {
  background: rgba(0,0,0,.4);
  border-top: 1px solid rgba(255,255,255,.04);
  backdrop-filter: blur(4px);
}
.battle-pocket-shell.arena-mode .battle-log-entry {
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .6rem;
  color: rgba(255,255,255,.35);
  letter-spacing: .02em;
}
.battle-pocket-shell.arena-mode .battle-log-entry.log-win  { color: var(--arena-green); }
.battle-pocket-shell.arena-mode .battle-log-entry.log-lose { color: var(--arena-red); }
.battle-pocket-shell.arena-mode .battle-log-entry.log-passive { color: rgba(255,200,0,.5); }
.dmg-number {
  position: absolute;
  pointer-events: none;
  z-index: var(--z-arena-hud);
  font-family: var(--font-display, 'Bebas Neue', sans-serif);
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .04em;
  text-shadow: 0 2px 8px rgba(0,0,0,.7);
  opacity: 0;
  transform: translateY(0);
  transition: none;
  user-select: none;
}
.dmg-number.is-active {
  animation: dmg-float 0.8s cubic-bezier(.22,1,.36,1) forwards;
}
.dmg-number.crit {
  font-size: 2.4rem;
  filter: drop-shadow(0 0 12px currentColor);
}
@keyframes dmg-float {
  0%   { opacity: 0; transform: translate(-50%,-50%) scale(.6); }
  15%  { opacity: 1; transform: translate(-50%,-80%) scale(1.15); }
  60%  { opacity: 1; transform: translate(-50%,-130%) scale(1); }
  100% { opacity: 0; transform: translate(-50%,-170%) scale(.8); }
}
.battle-float-popup {
  position: absolute;
  pointer-events: none;
  z-index: var(--z-arena-hud);
  font-family: var(--font-display, 'Bebas Neue', sans-serif);
  font-size: 1.1rem;
  letter-spacing: .18em;
  text-shadow: 0 1px 6px rgba(0,0,0,.6);
  opacity: 0;
  transform: translateX(-50%);
  user-select: none;
}
.battle-float-popup.is-active {
  animation: popup-float 1.1s cubic-bezier(.22,1,.36,1) forwards;
}
.battle-float-popup.ko {
  font-size: 2rem;
  letter-spacing: .25em;
  filter: drop-shadow(0 0 16px currentColor);
}
.battle-float-popup.crit {
  font-size: 1.5rem;
  filter: drop-shadow(0 0 10px currentColor);
}
@keyframes popup-float {
  0%   { opacity: 0; transform: translateX(-50%) translateY(0) scale(.7); }
  15%  { opacity: 1; transform: translateX(-50%) translateY(-14px) scale(1.1); }
  60%  { opacity: 1; transform: translateX(-50%) translateY(-28px) scale(1); }
  100% { opacity: 0; transform: translateX(-50%) translateY(-46px) scale(.9); }
}
.battle-particle {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: var(--z-arena-overlay);
  animation: particle-burst var(--d, .5s) var(--del, 0s) ease-out forwards;
}
@keyframes particle-burst {
  0%   { opacity: 1; transform: translate(0,0) scale(1); }
  100% { opacity: 0; transform: translate(var(--dx,20px), var(--dy,-30px)) scale(0); }
}
.battle-particle.trail {
  animation: particle-trail var(--d, .6s) var(--del, 0s) ease-out forwards;
}
@keyframes particle-trail {
  0%   { opacity: 1; transform: translate(0,0) scaleY(1); }
  40%  { opacity: .8; }
  100% { opacity: 0; transform: translate(var(--dx,20px), var(--dy,-40px)) scaleY(.3); }
}
#arena-lightning-canvas {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: var(--z-arena-fx-2);
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity .05s;
}
#arena-lightning-canvas.flash { opacity: 1; }
.battle-pocket-shell.arena-mode .battle-energy-crystal {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  transition: all .3s;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-energy-crystal.filled {
  background: var(--arena-green);
  border-color: rgba(80,220,160,.6);
  box-shadow: 0 0 6px rgba(80,220,160,.5);
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-energy-crystal.filled {
  background: var(--arena-red);
  border-color: rgba(220,80,80,.6);
  box-shadow: 0 0 6px rgba(220,80,80,.5);
}
.battle-pocket-shell.arena-mode .battle-result {
  position: absolute;
  inset: 0;
  z-index: var(--z-arena-fx-top);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.4rem;
  background: rgba(4,4,12,.82);
  backdrop-filter: blur(8px);
  border-radius: inherit;
}
.battle-pocket-shell.arena-mode .battle-result-title {
  font-family: var(--font-display, 'Bebas Neue', sans-serif);
  font-size: 4rem;
  letter-spacing: .1em;
  line-height: 1;
}
.battle-pocket-shell.arena-mode .battle-result-title.victory {
  color: var(--arena-gold);
  text-shadow: 0 0 40px rgba(255,200,0,.5), 0 0 80px rgba(255,140,0,.2), 0 4px 0 rgba(0,0,0,.5);
}
.battle-pocket-shell.arena-mode .battle-result-title.defeat {
  color: #ff5555;
  text-shadow: 0 0 40px rgba(220,50,50,.5), 0 4px 0 rgba(0,0,0,.5);
}
.battle-pocket-shell.arena-mode .battle-result-sub {
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .72rem;
  color: rgba(255,255,255,.3);
  letter-spacing: .2em;
  text-transform: uppercase;
}
@keyframes ov-title-in {
  0%   { opacity: 0; transform: scale(.6) translateY(10px); }
  60%  { transform: scale(1.06); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes ov-in {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}
.battle-pocket-shell.arena-mode .battle-result.is-active .battle-result-title {
  animation: ov-title-in .6s cubic-bezier(.34,1.3,.64,1) .15s both;
}
.battle-pocket-shell.arena-mode .battle-result.is-active .battle-result-sub {
  animation: ov-in .4s ease .4s both;
}
.battle-pocket-shell.arena-mode .battle-result.is-active .battle-result-stats {
  animation: ov-in .4s ease .6s both;
}
.battle-pocket-shell.arena-mode .battle-result.is-active .btn {
  animation: ov-in .4s ease .75s both;
}
.arena-banner {
  position: absolute;
  left: 50%;
  top: 12%;
  transform: translateX(-50%) translateY(8px) scale(.9);
  z-index: var(--z-arena-fx-3);
  font-family: var(--font-mono, 'Space Mono', monospace);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 7px 24px;
  border-radius: 999px;
  border: 1px solid;
  opacity: 0;
  pointer-events: none;
  text-align: center;
  transition: opacity .25s, transform .25s;
  white-space: nowrap;
}
.arena-banner.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0) scale(1);
}
.arena-banner.win {
  background: rgba(80,220,160,.07);
  border-color: rgba(80,220,160,.35);
  color: var(--arena-green);
}
.arena-banner.lose {
  background: rgba(220,80,80,.07);
  border-color: rgba(220,80,80,.35);
  color: var(--arena-red);
}
.arena-banner.info {
  background: rgba(255,200,0,.07);
  border-color: rgba(255,200,0,.35);
  color: var(--arena-gold);
}
.battle-pocket-shell.arena-mode .battle-pocket-bench-card {
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.02);
  transition: border-color .2s, background .2s, transform .2s;
}
.battle-pocket-shell.arena-mode .battle-pocket-bench-card:hover,
.battle-pocket-shell.arena-mode .battle-pocket-bench-card.bench-swappable:hover {
  border-color: rgba(80,220,160,.35);
  background: rgba(80,220,160,.06);
  transform: translateY(-2px);
}
.battle-pocket-shell.arena-mode .battle-pocket-bench-card.bench-synergy-active {
  border-color: rgba(255,200,0,.3);
  box-shadow: 0 0 12px rgba(255,200,0,.1);
}
.battle-pocket-shell.arena-mode .csb-item {
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.02);
  transition: all .2s;
}
.battle-pocket-shell.arena-mode .csb-item.csb-usable:hover {
  border-color: var(--ic, rgba(255,255,255,.3));
  background: rgba(255,255,255,.05);
  box-shadow: 0 0 14px rgba(255,255,255,.08);
  transform: translateY(-2px);
}
@media (max-width: 480px) {
  .battle-pocket-shell.arena-mode .battle-result-title { font-size: 2.8rem; }
  .battle-pocket-shell.arena-mode .dmg-number          { font-size: 1.4rem; }
  .battle-pocket-shell.arena-mode .dmg-number.crit     { font-size: 1.9rem; }
  .arena-orb-1, .arena-orb-2, .arena-orb-3, .arena-orb-4 { filter: blur(60px); }
}
.ecb-header {
  position: relative;
  z-index: var(--z-arena-above);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .55rem;
  padding: .6rem 1rem .5rem;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.ecb-title {
  font-family: var(--font-display, 'Bebas Neue', 'Cinzel Decorative', serif);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .32em;
  color: rgba(255,255,255,.10);
  text-transform: uppercase;
  text-align: center;
  transition: color .4s;
  user-select: none;
}
.ecb-score-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 480px;
}
.ecb-score-side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.ecb-score-label {
  font-family: var(--font-display, 'Bebas Neue', serif);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.ecb-score-label.ecb-player { color: rgba(80,220,160,.75); }
.ecb-score-label.ecb-enemy  { color: rgba(220,80,80,.75);  }
.ecb-pips-wrap {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  justify-content: center;
}
.ecb-pip {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.08);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.02);
  transition: border-color .3s;
}
.ecb-pip::before {
  content: '';
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: transparent;
  transition: all .4s;
}
.ecb-pip.ecb-player.filled {
  border-color: var(--arena-green, #50dca0);
  background: rgba(80,220,160,.06);
}
.ecb-pip.ecb-player.filled::before {
  background: var(--arena-green, #50dca0);
  box-shadow: 0 0 10px var(--arena-green, #50dca0), 0 0 20px rgba(80,220,160,.4);
}
.ecb-pip.ecb-enemy.filled {
  border-color: var(--arena-red, #dc5050);
  background: rgba(220,80,80,.06);
}
.ecb-pip.ecb-enemy.filled::before {
  background: var(--arena-red, #dc5050);
  box-shadow: 0 0 10px var(--arena-red, #dc5050), 0 0 20px rgba(220,80,80,.4);
}
@keyframes ecb-pip-pop {
  0%   { transform: scale(0) rotate(-180deg); opacity: 0; }
  50%  { transform: scale(1.8) rotate(15deg);  opacity: 1; }
  70%  { transform: scale(0.8) rotate(-5deg); }
  85%  { transform: scale(1.1); }
  100% { transform: scale(1) rotate(0); }
}
@keyframes ecb-ring-player {
  0%   { box-shadow: 0 0 0 0 rgba(80,220,160,1),  inset 0 0 0 0 rgba(80,220,160,.3); }
  100% { box-shadow: 0 0 0 18px rgba(80,220,160,0), inset 0 0 0 5px rgba(80,220,160,0); }
}
@keyframes ecb-ring-enemy {
  0%   { box-shadow: 0 0 0 0 rgba(220,80,80,1),  inset 0 0 0 0 rgba(220,80,80,.3); }
  100% { box-shadow: 0 0 0 18px rgba(220,80,80,0), inset 0 0 0 5px rgba(220,80,80,0); }
}
.ecb-pip.ecb-player.ecb-pip-pop           { animation: ecb-ring-player .7s ease-out; }
.ecb-pip.ecb-player.ecb-pip-pop::before   { animation: ecb-pip-pop .55s cubic-bezier(.34,1.56,.64,1) forwards; }
.ecb-pip.ecb-enemy.ecb-pip-pop            { animation: ecb-ring-enemy .7s ease-out; }
.ecb-pip.ecb-enemy.ecb-pip-pop::before    { animation: ecb-pip-pop .55s cubic-bezier(.34,1.56,.64,1) forwards; }
.ecb-vs-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}
.ecb-vs-badge {
  font-family: var(--font-display, 'Bebas Neue', serif);
  font-size: .85rem;
  font-weight: 900;
  color: rgba(255,255,255,.22);
  letter-spacing: .28em;
  border: 1px solid rgba(255,255,255,.07);
  padding: 4px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  text-shadow: 0 0 12px rgba(255,255,255,.1);
  white-space: nowrap;
}
.ecb-round-label {
  font-family: var(--font-display, 'Bebas Neue', serif);
  font-size: .55rem;
  letter-spacing: .18em;
  color: rgba(255,200,0,.45);
  text-transform: uppercase;
  transition: color .3s;
}
@keyframes ecb-round-bump {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.5); color: #F0B478; }
  100% { transform: scale(1); }
}
.ecb-round-label.ecb-round-bump {
  animation: ecb-round-bump .4s ease;
}
@media (max-width: 480px) {
  .ecb-pip { width: 22px; height: 22px; }
  .ecb-title { font-size: .6rem; }
  .ecb-vs-badge { font-size: .75rem; padding: 3px 10px; }
}

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@700;900&family=Rajdhani:wght@400;500;600;700&display=swap');

.battle-pocket-shell.arena-mode {
  --aaa-gold:      #E8A25C;
  --aaa-gold-glow: #ffde7a;
  --aaa-blue-glow: #6FA0B8;
  --aaa-red-glow:  #ff4a4a;
  --aaa-green:     #00e676;
  --aaa-bg:        #0A1420;
  --aaa-text:      #f0e8d0;
  --aaa-border:    rgba(240,192,64,0.3);
}

.battle-pocket-shell.arena-mode {
  background:
    radial-gradient(ellipse 80% 50% at 50% 100%, rgba(20,71,100,.5) 0%, transparent 70%),
    radial-gradient(ellipse 60% 40% at 50% 0%,   rgba(20,40,100,.4) 0%, transparent 70%),
    radial-gradient(ellipse 100% 60% at 50% 50%,  rgba(5,8,20,.8)   0%, transparent 100%),
    linear-gradient(180deg, #050810 0%, #0A1420 40%, #080b16 60%, #050810 100%) !important;
  border-radius: 18px !important;
  font-family: 'Rajdhani', sans-serif;
}

.arena-bg-grid {
  background-image:
    radial-gradient(circle, rgba(240,192,64,.05) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
  animation: none !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-terrain {
  background:
    radial-gradient(circle at 50% 10%, rgba(240,192,64,.03), transparent 30%),
    linear-gradient(180deg, #060C16 0%, #0A1420 38%, #080c15 62%, #060C16 100%) !important;
}
.battle-pocket-sky-haze,
.battle-pocket-sun,
.battle-pocket-horizon,
.battle-pocket-grass,
.battle-pocket-rings { display: none !important; }

.arena-orb-1 { background: rgba(40, 139, 180, .12) !important; }
.arena-orb-2 { background: rgba(240,192,64,.06) !important; }
.arena-orb-3 { background: rgba(74,158,255,.06) !important; }

.ecb-title {
  font-family: 'Cinzel', serif !important;
  color: rgba(240,192,64,.25) !important;
  letter-spacing: .35em !important;
}
.ecb-score-label.ecb-player {
  font-family: 'Cinzel', serif !important;
  color: var(--aaa-gold, #E8A25C) !important;
}
.ecb-score-label.ecb-enemy {
  font-family: 'Cinzel', serif !important;
  color: var(--aaa-red-glow, #ff4a4a) !important;
}
.ecb-vs-badge {
  font-family: 'Cinzel', serif !important;
  color: rgba(240,192,64,.35) !important;
  border-color: rgba(240,192,64,.15) !important;
  background: rgba(240,192,64,.04) !important;
}
.ecb-round-label {
  font-family: 'Cinzel', serif !important;
  color: rgba(240,192,64,.55) !important;
  letter-spacing: .25em !important;
}

.ecb-pip.ecb-player.filled {
  border-color: var(--aaa-gold, #E8A25C) !important;
  background: rgba(240,192,64,.08) !important;
}
.ecb-pip.ecb-player.filled::before {
  background: var(--aaa-gold, #E8A25C) !important;
  box-shadow: 0 0 10px var(--aaa-gold, #E8A25C), 0 0 20px rgba(240,192,64,.5) !important;
}
.ecb-pip.ecb-enemy.filled {
  border-color: var(--aaa-red-glow, #ff4a4a) !important;
  background: rgba(255,74,74,.08) !important;
}
.ecb-pip.ecb-enemy.filled::before {
  background: var(--aaa-red-glow, #ff4a4a) !important;
  box-shadow: 0 0 10px var(--aaa-red-glow, #ff4a4a), 0 0 20px rgba(255,74,74,.5) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-round {
  font-family: 'Cinzel', serif !important;
  color: var(--aaa-gold, #E8A25C) !important;
  letter-spacing: .12em !important;
  font-size: .72rem !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-turn {
  font-family: 'Rajdhani', sans-serif !important;
  color: rgba(240,232,208,.55) !important;
  letter-spacing: .06em !important;
  font-size: .65rem !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-board {
  background:
    radial-gradient(circle at 50% 6%, rgba(240,192,64,.04), transparent 28%),
    linear-gradient(180deg, #060C16 0%, #0d1225 38%, #0a1018 64%, #060e10 100%) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card {
  background: linear-gradient(160deg, #1a3a6a 0%, #0d1a30 60%, #080f1e 100%) !important;
  border: 1.5px solid rgba(74,158,255,.55) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.6), 0 0 20px rgba(74,158,255,.12), inset 0 1px 0 rgba(74,158,255,.1) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 0 30px rgba(74,158,255,.25), inset 0 1px 0 rgba(74,158,255,.2) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card-shimmer {
  background: linear-gradient(115deg,
    transparent 0%, transparent 25%,
    rgba(74,158,255,.06) 38%, rgba(120,180,255,.18) 50%,
    rgba(74,158,255,.06) 62%, transparent 75%, transparent 100%
  ) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-pocket-card-bar span {
  background: linear-gradient(90deg, #6FA0B8, #00c8ff) !important;
  box-shadow: 0 0 6px rgba(74,158,255,.5) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-zone.player .battle-energy-crystal.filled {
  background: linear-gradient(180deg, #6FA0B8, #2196f3) !important;
  border-color: rgba(74,158,255,.7) !important;
  box-shadow: 0 0 10px rgba(74,158,255,.5) !important;
}

.battle-pocket-zone.player .arena-rarity-bar {
  background: linear-gradient(90deg, transparent, var(--aaa-gold, #E8A25C), transparent) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card {
  background: linear-gradient(160deg, #6a1a1a 0%, #300d0d 60%, #1a0808 100%) !important;
  border: 1.5px solid rgba(255,74,74,.55) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.6), 0 0 20px rgba(255,74,74,.12), inset 0 1px 0 rgba(255,74,74,.1) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 0 30px rgba(255,74,74,.25) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card-shimmer {
  background: linear-gradient(115deg,
    transparent 0%, transparent 25%,
    rgba(255,74,74,.06) 38%, rgba(255,150,150,.18) 50%,
    rgba(255,74,74,.06) 62%, transparent 75%, transparent 100%
  ) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-pocket-card-bar span {
  background: linear-gradient(90deg, #ff4a4a, #ff7070) !important;
  box-shadow: 0 0 6px rgba(255,74,74,.5) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-energy-crystal.filled {
  background: linear-gradient(180deg, #ff4a4a, #c0392b) !important;
  border-color: rgba(255,74,74,.7) !important;
  box-shadow: 0 0 10px rgba(255,74,74,.5) !important;
}
.battle-pocket-zone.enemy .arena-rarity-bar {
  background: linear-gradient(90deg, transparent, var(--aaa-red-glow, #ff4a4a), transparent) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-card-name {
  font-family: 'Cinzel', serif !important;
  font-size: .85rem !important;
  color: var(--aaa-gold, #E8A25C) !important;
  text-shadow: 0 0 8px rgba(240,192,64,.4) !important;
  letter-spacing: .04em !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-hp-pill {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600 !important;
  font-size: .55rem !important;
  background: rgba(5,8,20,.8) !important;
  border: 1px solid rgba(240,192,64,.2) !important;
  color: var(--aaa-text, #f0e8d0) !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-action-panel {
  background: rgba(5,8,20,.85) !important;
  border: 1px solid rgba(240,192,64,.2) !important;
  border-radius: 12px !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-action-kicker {
  font-family: 'Cinzel', serif !important;
  font-size: .6rem !important;
  letter-spacing: .25em !important;
  color: rgba(240,192,64,.45) !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid rgba(240,192,64,.08) !important;
  padding-bottom: .25rem !important;
}

.battle-pocket-shell.arena-mode .battle-action-pill,
.battle-pocket-shell.arena-mode .btn[data-battle-action] {
  font-family: 'Cinzel', serif !important;
  letter-spacing: .08em !important;
  border-radius: 8px !important;
  border-color: rgba(255,255,255,.08) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)) !important;
  transition: background .15s, border-color .2s, box-shadow .2s !important;
}
.battle-pocket-shell.arena-mode .battle-action-pill:hover {
  border-color: rgba(240,192,64,.5) !important;
  background: rgba(240,192,64,.07) !important;
  box-shadow: 0 0 18px rgba(240,192,64,.12) !important;
}

.battle-pocket-shell.arena-mode .battle-action-pill.action-attack {
  border-color: rgba(255,74,74,.4) !important;
  background: linear-gradient(160deg, rgba(106,26,26,.55), rgba(48,13,13,.38)) !important;
}
.battle-pocket-shell.arena-mode .battle-action-pill.action-attack:hover {
  border-color: rgba(255,74,74,.8) !important;
  box-shadow: 0 0 20px rgba(255,74,74,.2) !important;
}

.battle-pocket-shell.arena-mode .battle-action-pill.action-special {
  border-color: rgba(39,77,176,.4) !important;
  background: linear-gradient(160deg, rgba(20,51,100,.55), rgba(10,37,60,.38)) !important;
}

.battle-pocket-shell.arena-mode .battle-action-pill.action-signature,
.battle-pocket-shell.arena-mode .btn[data-battle-action="signature"] {
  border-color: rgba(240,192,64,.45) !important;
  background: linear-gradient(160deg, rgba(100,70,5,.55), rgba(60,40,5,.38)) !important;
  color: var(--aaa-gold, #E8A25C) !important;
}
.battle-pocket-shell.arena-mode .battle-action-pill.action-signature:hover {
  border-color: rgba(240,192,64,.85) !important;
  box-shadow: 0 0 20px rgba(240,192,64,.2) !important;
}

.battle-pocket-shell.arena-mode .battle-action-pill.action-flee {
  border-color: rgba(96,125,139,.3) !important;
  background: rgba(30,35,55,.5) !important;
}

.battle-pocket-shell.arena-mode .battle-action-icon {
  background: rgba(240,192,64,.1) !important;
  border: 1px solid rgba(240,192,64,.2) !important;
  border-radius: 8px !important;
}

.battle-pocket-shell.arena-mode .battle-action-copy strong {
  font-family: 'Cinzel', serif !important;
  font-size: 1rem !important;
  color: var(--aaa-text, #f0e8d0) !important;
  letter-spacing: .04em !important;
}
.battle-pocket-shell.arena-mode .battle-action-copy small {
  font-family: 'Rajdhani', sans-serif !important;
  font-size: .78rem !important;
  color: rgba(240,232,208,.5) !important;
}

.battle-pocket-shell.arena-mode .battle-result-title.victory {
  font-family: 'Cinzel', serif !important;
  color: var(--aaa-gold, #E8A25C) !important;
  text-shadow: 0 0 40px rgba(240,192,64,.5), 0 0 80px rgba(240,150,20,.2), 0 4px 0 rgba(0,0,0,.5) !important;
}
.battle-pocket-shell.arena-mode .battle-result-title.defeat {
  font-family: 'Cinzel', serif !important;
  color: var(--aaa-red-glow, #ff4a4a) !important;
  text-shadow: 0 0 40px rgba(255,74,74,.5), 0 4px 0 rgba(0,0,0,.5) !important;
}
.battle-pocket-shell.arena-mode .battle-result-sub {
  font-family: 'Rajdhani', sans-serif !important;
  letter-spacing: .18em !important;
  color: rgba(240,232,208,.35) !important;
}

.battle-pocket-shell.arena-mode .battle-log {
  background: rgba(5,8,20,.85) !important;
  border-top: 1px solid rgba(240,192,64,.08) !important;
}
.battle-pocket-shell.arena-mode .battle-log-entry {
  font-family: 'Rajdhani', sans-serif !important;
  font-size: .68rem !important;
  color: rgba(240,232,208,.45) !important;
  border-left: 2px solid rgba(240,192,64,.3) !important;
}
.battle-pocket-shell.arena-mode .battle-log-entry.log-win {
  color: var(--aaa-green, #00e676) !important;
  border-left-color: var(--aaa-green, #00e676) !important;
}
.battle-pocket-shell.arena-mode .battle-log-entry.log-lose {
  color: var(--aaa-red-glow, #ff4a4a) !important;
  border-left-color: var(--aaa-red-glow, #ff4a4a) !important;
}

.dmg-number {
  font-family: 'Cinzel', serif !important;
  letter-spacing: .04em !important;
}

.arena-banner.win {
  background: rgba(0,230,118,.06) !important;
  border-color: rgba(0,230,118,.35) !important;
  color: var(--aaa-green, #00e676) !important;
  font-family: 'Cinzel', serif !important;
}
.arena-banner.lose {
  background: rgba(255,74,74,.06) !important;
  border-color: rgba(255,74,74,.35) !important;
  color: var(--aaa-red-glow, #ff4a4a) !important;
  font-family: 'Cinzel', serif !important;
}
.arena-banner.info {
  border-color: rgba(240,192,64,.35) !important;
  color: var(--aaa-gold, #E8A25C) !important;
  font-family: 'Cinzel', serif !important;
}

.battle-pocket-shell.arena-mode .battle-pocket-bench-card {
  border-color: rgba(240,192,64,.12) !important;
  background: rgba(240,192,64,.02) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-bench-card:hover {
  border-color: rgba(240,192,64,.4) !important;
  background: rgba(240,192,64,.05) !important;
}

.battle-pocket-shell.arena-mode .battle-hud-name {
  font-family: 'Cinzel', serif !important;
  font-size: .8rem !important;
  color: var(--aaa-gold, #E8A25C) !important;
  text-shadow: 0 0 8px rgba(240,192,64,.3) !important;
}
.battle-pocket-shell.arena-mode .battle-pocket-zone.enemy .battle-hud-name {
  color: var(--aaa-red-glow, #ff4a4a) !important;
  text-shadow: 0 0 8px rgba(255,74,74,.3) !important;
}

.arena-vs-badge {
  font-family: 'Cinzel', serif !important;
  color: rgba(240,192,64,.3) !important;
  border-color: rgba(240,192,64,.12) !important;
  background: rgba(240,192,64,.03) !important;
}

.arena-pip.player.filled {
  border-color: var(--aaa-gold, #E8A25C) !important;
  background: rgba(240,192,64,.07) !important;
}
.arena-pip.player.filled::before {
  background: var(--aaa-gold, #E8A25C) !important;
  box-shadow: 0 0 10px var(--aaa-gold, #E8A25C), 0 0 20px rgba(240,192,64,.5) !important;
}
.arena-pip.enemy.filled {
  border-color: var(--aaa-red-glow, #ff4a4a) !important;
  background: rgba(255,74,74,.07) !important;
}
.arena-pip.enemy.filled::before {
  background: var(--aaa-red-glow, #ff4a4a) !important;
  box-shadow: 0 0 10px var(--aaa-red-glow, #ff4a4a), 0 0 20px rgba(255,74,74,.5) !important;
}