/* LexiRaid alpaca visual upgrade
 * Load this file after style.css.
 */

/* Stationary alpacas: show the grimacing, long-neck frame only while firing. */
.unit.alpaca-unit.stationary.attacking .stationary-art {
  background: url("assets/alpaca-spit.png?v=alpaca-20260805") center bottom / contain no-repeat;
  filter: drop-shadow(1px 3px 0 rgba(56, 65, 47, .16));
  animation: alpaca-spit-snap 300ms cubic-bezier(.22, .9, .35, 1) both;
}

.unit.alpaca-unit.stationary.level-2.attacking .stationary-art {
  background-image: url("assets/spit-lv2-v2.png");
}

.unit.alpaca-unit.stationary.level-3.attacking .stationary-art {
  background-image: url("assets/spit-lv3-v2.png");
}

/* The golden body already communicates Lv.3; do not draw a ring around it. */
.unit.alpaca-unit.stationary.level-3 .stationary-art::after {
  display: none;
}

.unit.alpaca-unit.stationary.attacking .stationary-art .alpaca-art-image {
  opacity: 0 !important;
}

/* Keep the existing level tag above the replacement artwork. */
.unit.alpaca-unit.stationary.attacking .stationary-art .level-tag {
  z-index: 9;
}

/* Level 2/3 walking frames are complete cutouts, so keep both frames aligned. */
.unit.alpaca-unit.moving.level-2 .moving-art,
.unit.alpaca-unit.moving.level-3 .moving-art {
  filter: drop-shadow(1px 3px 0 rgba(56, 65, 47, .16));
}

.unit.alpaca-unit.moving.level-3 .moving-art {
  filter: drop-shadow(0 0 5px rgba(244, 197, 66, .82)) drop-shadow(1px 3px 0 rgba(56, 65, 47, .16));
}

.unit.alpaca-unit.moving.level-2 .walking-frame,
.unit.alpaca-unit.moving.level-3 .walking-frame {
  object-fit: contain;
  object-position: center bottom;
  transform: none;
}

/* The golden body is the level cue, so omit the old generic frame overlay. */
.unit.alpaca-unit.moving.level-3 .moving-art::after {
  display: none;
}

@keyframes alpaca-spit-snap {
  0% { transform: rotate(-2deg) scale(.91, 1.04); }
  52% { transform: rotate(3deg) scale(1.08, .94); }
  100% { transform: rotate(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .unit.alpaca-unit.stationary.attacking .stationary-art {
    animation: none;
  }
}