/* The enemy side uses original Cosmic Invasion idle clips, at one shared ground line. */
.action-fighter--enemy {
  left: 37% !important;
  right: auto !important;
  bottom: calc(28% - 42px) !important;
  width: 40% !important;
  transform: none !important;
  z-index: 7 !important;
}
.arena-enemy-team { display: flex; align-items: flex-end; justify-content: center; gap: 5px; width: 100%; }
.arena-enemy-team[data-count="3"] { justify-content: space-between; }
.action-fighter--enemy .arena-foe span {
  position: relative !important; top: auto !important; left: auto !important;
  transform: none !important; white-space: normal !important; padding: 0;
  border: 0; background: transparent; box-shadow: none; color: inherit; font: inherit;
}
.arena-foe {
  display: flex; flex: 1 1 0; flex-direction: column; align-items: center; justify-content: flex-end;
  min-width: 0; max-width: 180px; height: 164px; padding: 0 3px 5px;
  border: 2px solid transparent; border-radius: 3px; background: none;
  color: #f4f5f4; cursor: pointer; font: 700 8px/1.2 'Silkscreen', monospace;
  text-shadow: 1px 2px #06101d; transition: border-color .12s, background .12s, transform .12s;
}
.arena-foe:not(:disabled):hover, .arena-foe:focus-visible { transform: translateY(-4px); border-color: #72d7ed; background: rgba(11,34,51,.45); }
.arena-foe--selected { border-color: #f6c874; background: linear-gradient(transparent 48%,rgba(8,23,36,.75)); box-shadow: inset 0 -2px #835f30; }
.arena-foe--down { opacity: .42; cursor: default; }
.action-fighter--enemy .arena-foe .arena-foe__sprite {
  display: block; flex: 0 0 auto; width: var(--cell-w); height: var(--cell-h);
  background: var(--foe-sprite) 0 0 / auto no-repeat transparent;
  image-rendering: pixelated; transform-origin: center bottom; transform: scale(-1.16, 1.16) !important;
  filter: drop-shadow(4px 5px 0 rgba(0,0,0,.75));
  animation: cosmic-foe-idle 1.25s steps(var(--frame-steps),end) infinite alternate;
}
.arena-enemy-team[data-count="1"] .arena-foe { flex: 0 0 180px; height: 177px; }
.action-fighter--enemy .arena-enemy-team[data-count="1"] .arena-foe .arena-foe__sprite { transform: scale(-1.6, 1.6) !important; }
.action-fighter--enemy .arena-foe .arena-foe__name { display:block; width:100%; overflow:hidden; white-space:nowrap !important; text-overflow:ellipsis; margin-top: 7px; color:#fff1d4; }
.action-fighter--enemy .arena-foe .arena-foe__health { display:block; width:95%; height:7px; margin-top:4px; border:1px solid #132332; background:#551e24; }
.arena-foe__health i { display:block; height:100%; background:linear-gradient(90deg,#ec5b59,#ffad70); }
.action-fighter--enemy .arena-foe .arena-foe__value { display:block; margin-top:3px; color:#dbe4e5; font-size:7px; }
.arena-foe[data-motion="hurt"] .arena-foe__sprite { animation: enemy-hurt .44s steps(4,end) both; }
.arena-foe[data-motion="attack"] .arena-foe__sprite { animation: enemy-attack .48s steps(4,end) both; }
.arena-foe[data-motion="defeat"] .arena-foe__sprite { animation: enemy-defeat .8s steps(6,end) both; }
.arena-foe[data-motion="phase"] .arena-foe__sprite { animation: enemy-phase .65s steps(5,end) both; }
@keyframes cosmic-foe-idle { to { background-position-x: var(--frame-end); } }
body.game-reduce-motion .arena-foe__sprite { animation:none !important; }
@media (prefers-reduced-motion:reduce) { .arena-foe__sprite { animation:none !important; } }
@media (max-width:800px) {
  .action-fighter--enemy { left:38% !important; bottom:calc(28% - 34px) !important; width:59% !important; }
  .arena-foe { height:135px; padding:0 1px 2px; font-size:6px; }
  .action-fighter--enemy .arena-foe .arena-foe__sprite { transform:scale(-.83, .83) !important; margin-bottom:-7px; }
  .arena-enemy-team[data-count="1"] .arena-foe { height:145px; }
  .action-fighter--enemy .arena-enemy-team[data-count="1"] .arena-foe .arena-foe__sprite { transform:scale(-1.15, 1.15) !important; }
  .arena-foe__name { margin-top:0; }
  .arena-foe__health { height:6px; margin-top:2px; }
  .arena-foe__value { font-size:6px; }
}
@media (max-width:500px) {
  .action-fighter--enemy { left:35% !important; bottom:calc(28% - 30px) !important; width:63% !important; }
  .arena-enemy-team { gap:1px; }
  .arena-foe { height:120px; }
  .action-fighter--enemy .arena-foe .arena-foe__sprite { transform:scale(-.7, .7) !important; margin-bottom:-15px; }
  .arena-enemy-team[data-count="1"] .arena-foe { height:130px; }
  .action-fighter--enemy .arena-enemy-team[data-count="1"] .arena-foe .arena-foe__sprite { transform:scale(-1.1, 1.1) !important; }
}