/* Base Animations */
@keyframes explode {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  50% {
    transform: scale(1.5);
    opacity: 0.8;
    box-shadow: 0 0 20px #ef4444, 0 0 40px #fb923c;
  }

  100% {
    transform: scale(1);
    opacity: 1;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.4);
  }
}

@keyframes itemReveal {
  0% {
    transform: scale(0.5) rotate(-20deg);
    opacity: 0;
  }

  60% {
    transform: scale(1.2) rotate(10deg);
  }

  100% {
    transform: scale(1) rotate(0);
    opacity: 1;
  }
}

@keyframes pulseGlowGreen {

  0%,
  100% {
    box-shadow: 0 0 5px #10b981;
  }

  50% {
    box-shadow: 0 0 20px #10b981, 0 0 30px #34d399;
  }
}

@keyframes pulseGlowBlue {

  0%,
  100% {
    box-shadow: 0 0 5px #3b82f6;
  }

  50% {
    box-shadow: 0 0 20px #3b82f6, 0 0 30px #60a5fa;
  }
}

@keyframes pulseGlowPurple {

  0%,
  100% {
    box-shadow: 0 0 5px #8b5cf6;
  }

  50% {
    box-shadow: 0 0 20px #8b5cf6, 0 0 30px #a78bfa;
  }
}

@keyframes pulseGlowRed {

  0%,
  100% {
    box-shadow: 0 0 5px #ef4444;
  }

  50% {
    box-shadow: 0 0 20px #ef4444, 0 0 30px #f87171;
  }
}

@keyframes pulseGlowGold {

  0%,
  100% {
    box-shadow: 0 0 5px #f59e0b;
  }

  50% {
    box-shadow: 0 0 20px #f59e0b, 0 0 30px #fbbf24;
  }
}

@keyframes glint {
  0% {
    filter: brightness(1);
  }

  50% {
    filter: brightness(1.8) contrast(1.2);
  }

  100% {
    filter: brightness(1);
  }
}

@keyframes shake {

  0%,
  100% {
    transform: translate(0, 0);
  }

  25% {
    transform: translate(-2px, -2px);
  }

  50% {
    transform: translate(2px, 2px);
  }

  75% {
    transform: translate(-2px, 2px);
  }
}

@keyframes floating {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-5px);
  }
}

/* Item Classes */
.explosion {
  animation: explode 0.5s ease-out;
}

/* Category: Healing */
.item-medkit {
  animation: itemReveal 0.5s ease-out, pulseGlowGreen 2s infinite;
  background-color: rgba(16, 185, 129, 0.2) !important;
}

.item-revive {
  animation: itemReveal 0.5s ease-out, pulseGlowGreen 1.5s infinite;
  background-color: rgba(16, 185, 129, 0.3) !important;
  border: 1px solid #10b981;
}

/* Category: Attack */
.item-knife {
  animation: itemReveal 0.5s ease-out, glint 1s infinite;
  background-color: rgba(239, 68, 68, 0.1) !important;
}

.item-lightning {
  animation: itemReveal 0.4s ease-out, glint 0.5s infinite;
  background-color: rgba(239, 68, 68, 0.2) !important;
}

.item-poison {
  animation: itemReveal 0.6s ease-out, pulseGlowPurple 3s infinite;
  background-color: rgba(139, 92, 246, 0.2) !important;
}

/* Category: Utility */
.item-shield {
  animation: itemReveal 0.5s ease-out, pulseGlowBlue 2s infinite;
  background-color: rgba(59, 130, 246, 0.2) !important;
  border-radius: 50% !important;
}

.item-skip {
  animation: itemReveal 0.5s ease-out, pulseGlowGold 2s infinite;
  background-color: rgba(245, 158, 11, 0.2) !important;
  opacity: 0.8;
}

.item-magnifier {
  animation: itemReveal 0.5s ease-out, floating 2s ease-in-out infinite;
  background-color: rgba(59, 130, 246, 0.1) !important;
}

/* Category: Risk/Meta */
.item-bomb_timer {
  animation: itemReveal 0.5s ease-out, pulseGlowRed 0.5s infinite, shake 0.2s infinite;
  background-color: rgba(239, 68, 68, 0.3) !important;
}

.item-curse {
  animation: itemReveal 0.7s ease-out, pulseGlowPurple 1s infinite;
  background-color: rgba(139, 92, 246, 0.3) !important;
  filter: grayscale(0.5) contrast(1.5);
}

.item-chest {
  animation: itemReveal 0.5s ease-out, pulseGlowGold 3s infinite;
  background-color: rgba(245, 158, 11, 0.3) !important;
}

@keyframes floatUp {
  0% {
    transform: translateY(0);
    opacity: 0;
  }

  20% {
    opacity: 1;
  }

  80% {
    opacity: 1;
  }

  100% {
    transform: translateY(-40px);
    opacity: 0;
  }
}

.float-label {
  position: absolute;
  pointer-events: none;
  font-weight: 900;
  font-size: 1.5rem;
  z-index: 100;
  animation: floatUp 1s ease-out forwards;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.8), 2px 2px 0 #000;
  white-space: nowrap;
}

.text-heal {
  color: #10b981;
}

.text-damage {
  color: #ef4444;
}

.text-item {
  color: #fbbf24;
}

/* Generic Item Reveal */
.item-generic {
  animation: itemReveal 0.5s ease-out;
}

/* HP Damage Pulse */
.hp-damage {
  animation: hpPulse 0.4s ease-in-out;
}

@keyframes hpPulse {

  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.2);
    color: #ef4444;
  }
}

/* 屏幕抖动效果 - 受到伤害时触发 */
@keyframes screenShake {
  0%, 100% { transform: translate(0); }
  10% { transform: translate(-8px, 6px); }
  20% { transform: translate(8px, -6px); }
  30% { transform: translate(-6px, -6px); }
  40% { transform: translate(6px, 6px); }
  50% { transform: translate(-6px, 4px); }
  60% { transform: translate(6px, -4px); }
  70% { transform: translate(-4px, 6px); }
  80% { transform: translate(4px, -6px); }
  90% { transform: translate(-2px, 2px); }
}

.screen-shake {
  animation: screenShake 0.4s ease-in-out;
}

/* 玩家受伤闪烁效果 */
@keyframes damageFlash {
  0%, 100% { 
    background: transparent;
    box-shadow: none;
  }
  25%, 75% { 
    background: rgba(239, 68, 68, 0.4);
    box-shadow: 0 0 20px rgba(239, 68, 68, 0.6), inset 0 0 15px rgba(239, 68, 68, 0.3);
  }
  50% {
    background: rgba(239, 68, 68, 0.6);
    box-shadow: 0 0 30px rgba(239, 68, 68, 0.8), inset 0 0 20px rgba(239, 68, 68, 0.5);
  }
}

.player-damaged {
  animation: damageFlash 0.6s ease-in-out;
}

/* 玩家治疗效果 */
@keyframes healGlow {
  0%, 100% { 
    box-shadow: none;
  }
  50% { 
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.6), inset 0 0 10px rgba(16, 185, 129, 0.3);
  }
}

.player-healed {
  animation: healGlow 0.6s ease-in-out;
}

/* 回合倒计时进度条 */
.turn-timer-bar {
  transition: width 1s linear;
}

/* 倒计时紧急状态 */
@keyframes urgentPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.timer-urgent {
  animation: urgentPulse 0.5s ease-in-out infinite;
  color: #ef4444 !important;
}