/* ==========================================================================
   View Transitions, Keyframes & Micro-animations
   ========================================================================== */

/* Castle Pip Pulse Animation */
@keyframes pip-pulse {
  0% {
    transform: scale(1.1);
  }
  50% {
    transform: scale(1.28);
  }
  100% {
    transform: scale(1.1);
  }
}

/* Email Verification Icon Pulse */
@keyframes verify-pulse {
  0%,
  100% {
    transform: scale(1);
    opacity: 0.9;
  }
  50% {
    transform: scale(1.1);
    opacity: 1;
  }
}

/* Active Player HUD Card Pulse */
@keyframes hud-cards-pulse {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  50% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 0.8;
  }
}

/* Solo Jester Token Pulse */
@keyframes jesterPulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 5px var(--color-gold-glow);
  }
  100% {
    transform: scale(1.06);
    box-shadow: 0 0 25px hsla(45, 95%, 50%, 0.6);
    border-color: var(--color-gold);
  }
}

/* Player Online Presence Pulse */
@keyframes pulse-online {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 5px rgba(74, 222, 128, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0);
  }
}

/* Card Draw / Deal Animation */
@keyframes cardDrawIn {
  0% {
    transform: translateY(60px) rotate(8deg) scale(0.8);
    opacity: 0;
  }
  100% {
    transform: translateY(0) rotate(0) scale(1);
    opacity: 1;
  }
}

.card-draw-anim {
  animation: cardDrawIn 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.1) both;
}

/* Enemy Took Damage Animation */
@keyframes enemyDamage {
  0%,
  100% {
    transform: scale(1) rotate(0);
  }
  15% {
    transform: scale(0.95) rotate(-3deg) translateX(-5px);
    filter: brightness(1.4) drop-shadow(0 0 15px rgba(239, 68, 68, 0.8));
  }
  30% {
    transform: scale(1.05) rotate(3deg) translateX(5px);
    filter: brightness(1.4) drop-shadow(0 0 15px rgba(239, 68, 68, 0.8));
  }
  45% {
    transform: scale(0.95) rotate(-2deg) translateX(-4px);
  }
  60% {
    transform: scale(1.02) rotate(2deg) translateX(4px);
  }
  75% {
    transform: scale(0.98) rotate(-1deg) translateX(-2px);
  }
  90% {
    transform: scale(1.01) rotate(1deg) translateX(2px);
  }
}

.enemy-damage-anim {
  animation: enemyDamage 0.5s ease-in-out;
}

/* Player Took Damage (Vignette & Shake) Animation */
@keyframes playerDamage {
  0%,
  100% {
    transform: translate(0, 0);
    box-shadow: none;
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translate(-4px, 2px);
    box-shadow: inset 0 0 50px rgba(239, 68, 68, 0.3);
  }
  20%,
  40%,
  60%,
  80% {
    transform: translate(4px, -2px);
    box-shadow: inset 0 0 50px rgba(239, 68, 68, 0.3);
  }
}

.player-damage-anim {
  animation: playerDamage 0.5s ease-in-out;
}

/* HUD Stat Pulse Animations */
@keyframes statHealPulse {
  0%,
  100% {
    transform: scale(1);
    box-shadow: none;
    border-color: rgba(255, 255, 255, 0.06);
  }
  50% {
    transform: scale(1.1);
    box-shadow: 0 0 15px rgba(34, 197, 94, 0.5);
    border-color: rgb(34, 197, 94);
  }
}
.stat-heal-anim {
  animation: statHealPulse 0.4s ease-out;
}

@keyframes statDrawPulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
    opacity: 0.8;
  }
}
.stat-draw-anim {
  animation: statDrawPulse 0.3s ease-out;
}

@keyframes statDiscardPulse {
  0%,
  100% {
    transform: scale(1);
    border-color: rgba(255, 255, 255, 0.06);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.4);
    border-color: rgb(239, 68, 68);
  }
}
.stat-discard-anim {
  animation: statDiscardPulse 0.3s ease-out;
}

@keyframes statDefeatPulse {
  0%,
  100% {
    transform: scale(1);
    border-color: rgba(255, 255, 255, 0.06);
  }
  50% {
    transform: scale(1.1);
    box-shadow: 0 0 15px var(--color-gold-glow);
    border-color: var(--color-gold);
  }
}
.stat-defeat-anim {
  animation: statDefeatPulse 0.4s ease-out;
}

/* Enemy Card Entrance Animation */
@keyframes enemyEntrance {
  0% {
    transform: translateY(-80px) scale(0.85);
    opacity: 0;
    filter: brightness(2) drop-shadow(0 0 20px var(--color-gold-glow));
  }
  50% {
    filter: brightness(1.5) drop-shadow(0 0 15px var(--color-gold-glow));
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
    filter: brightness(1);
  }
}

.enemy-entrance-anim {
  animation: enemyEntrance 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.15) both;
}

/* Enemy Defeat: Discard (Overkill) Animation */
@keyframes enemyDefeatDiscard {
  0% {
    transform: translate(0, 0) scale(1) rotate(0deg);
    opacity: 1;
    filter: brightness(1);
  }
  25% {
    transform: translate(0, -15px) scale(1.05) rotate(-3deg);
    filter: brightness(1.2) drop-shadow(0 0 15px rgba(239, 68, 68, 0.5));
    opacity: 1;
  }
  100% {
    transform: translate(40px, 200px) scale(0.5) rotate(15deg);
    opacity: 0;
    filter: brightness(0.2) grayscale(1);
  }
}

.enemy-defeat-discard-anim {
  animation: enemyDefeatDiscard 0.75s cubic-bezier(0.55, 0.055, 0.675, 0.19)
    both;
}

/* Enemy Defeat: Exact Damage (Top-deck) Animation */
@keyframes enemyDefeatExact {
  0% {
    transform: translate(0, 0) scale(1) rotate(0deg) rotateY(0deg);
    opacity: 1;
    filter: brightness(1);
  }
  35% {
    transform: translate(0, -25px) scale(1.1) rotate(5deg) rotateY(90deg);
    filter: brightness(1.5) drop-shadow(0 0 25px var(--color-gold-glow));
    opacity: 1;
  }
  100% {
    transform: translate(-60px, -180px) scale(0.4) rotate(-10deg)
      rotateY(180deg);
    opacity: 0;
    filter: brightness(2) drop-shadow(0 0 15px var(--color-gold-glow));
  }
}

.enemy-defeat-exact-anim {
  animation: enemyDefeatExact 0.85s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

/* Accessibility: Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }

  .card-draw-anim,
  .enemy-damage-anim,
  .player-damage-anim,
  .stat-heal-anim,
  .stat-draw-anim,
  .stat-discard-anim,
  .stat-defeat-anim,
  .enemy-entrance-anim,
  .enemy-defeat-discard-anim,
  .enemy-defeat-exact-anim,
  .pip.pip-fighting,
  .verify-icon,
  .player-hud-item.active-turn .player-hud-cards,
  .jester-token.highlight,
  .presence-dot.online {
    animation: none !important;
  }
}
