/* ====================== ANIMATIONS ====================== */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

@keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-5px); }
  100% { transform: translateY(0px); }
}

@keyframes glow {
  0% { box-shadow: 0 0 5px var(--primary-color); }
  50% { box-shadow: 0 0 20px var(--primary-color); }
  100% { box-shadow: 0 0 5px var(--primary-color); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes shine {
  0% { left: -50%; }
  100% { left: 100%; }
}

@keyframes botPulse {
  0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.7); }
  70% { box-shadow: 0 0 0 10px rgba(139, 92, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}

@keyframes floatHat {
  0%, 100% { transform: translateX(-50%) translateY(0px) rotate(-5deg); }
  50% { transform: translateX(-50%) translateY(-5px) rotate(5deg); }
}

@keyframes glowStar {
  0% { opacity: 0.8; transform: scale(1); }
  100% { opacity: 1; transform: scale(1.2); }
}

@keyframes enhanced-glow-pulse {
  0% { 
      opacity: 0.8; 
      text-shadow: 0 0 10px currentColor, 0 0 20px currentColor;
  }
  50% { 
      opacity: 1; 
      text-shadow: 0 0 20px currentColor, 0 0 40px currentColor, 0 0 60px rgba(255, 255, 255, 0.5);
  }
  100% { 
      opacity: 0.9; 
      text-shadow: 0 0 15px currentColor, 0 0 30px currentColor;
  }
}

@keyframes enhanced-pulse-effect {
  0% { 
      opacity: 1;
      transform: scale(1);
  }
  50% { 
      opacity: 0.85;
      transform: scale(1.03);
  }
  100% { 
      opacity: 1;
      transform: scale(1);
  }
}

@keyframes enhanced-rainbow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes gold-shine {
  0% { opacity: 0; left: -100%; }
  20% { opacity: 1; }
  40% { opacity: 0.8; }
  60% { opacity: 1; }
  80% { opacity: 0.8; }
  100% { opacity: 0; left: 100%; }
}

@keyframes enhanced-bounce {
  0%, 100% { 
      transform: translateY(0) rotate(0deg); 
  }
  25% { 
      transform: translateY(-4px) rotate(-5deg); 
  }
  50% { 
      transform: translateY(0) rotate(0deg); 
  }
  75% { 
      transform: translateY(-4px) rotate(5deg); 
  }
}

@keyframes crown-glow {
  0% { opacity: 0.5; transform: scale(0.9); }
  100% { opacity: 0.8; transform: scale(1.1); }
}

@keyframes skeleton-breathe {
  0% { 
      filter: drop-shadow(0 0 5px currentColor) brightness(1.1);
      opacity: 0.9;
  }
  100% { 
      filter: drop-shadow(0 0 12px currentColor) brightness(1.3);
      opacity: 1;
  }
}

@keyframes days-pulse {
  0% { opacity: 0.8; }
  100% { opacity: 1; }
}

@keyframes active-pulse {
  0% { 
      box-shadow: 
          0 0 10px rgba(0, 198, 255, 0.4),
          0 0 20px rgba(0, 198, 255, 0.2),
          inset 0 0 10px rgba(0, 198, 255, 0.1);
  }
  100% { 
      box-shadow: 
          0 0 20px rgba(0, 198, 255, 0.7),
          0 0 40px rgba(0, 198, 255, 0.4),
          inset 0 0 20px rgba(0, 198, 255, 0.3);
  }
}

@keyframes shimmer {
  0% { transform: translateX(-100%) rotate(30deg); }
  100% { transform: translateX(100%) rotate(30deg); }
}

@keyframes online-glow {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes rotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes toggle-shine {
  0% { left: -100%; }
  20% { left: 100%; }
  100% { left: 100%; }
}

@keyframes status-pulse {
  0% { box-shadow: 0 0 0 0 rgba(76, 175, 80, 0.7); }
  70% { box-shadow: 0 0 0 8px rgba(76, 175, 80, 0); }
  100% { box-shadow: 0 0 0 0 rgba(76, 175, 80, 0); }
}

@keyframes slideIn {
  from {
      opacity: 0;
      transform: translateX(-50%) translateY(-20px);
  }
  to {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
  }
}

@keyframes slideOut {
  from {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
  }
  to {
      opacity: 0;
      transform: translateX(-50%) translateY(-20px);
  }
}