/* ===== DEAL CARD ANIMATION ===== */
@keyframes dealCard {
  0% {
    opacity: 0;
    transform: translate(calc(40vw - var(--card-width) / 2), -150px) scale(0.5) rotate(-15deg);
  }
  50% {
    opacity: 1;
    transform: translate(0, -8px) scale(1.03) rotate(1deg);
  }
  75% {
    transform: translate(0, 2px) scale(0.99) rotate(0deg);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0) scale(1) rotate(0deg);
  }
}

.animate-deal-card {
  opacity: 0;
  animation: dealCard 0.45s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

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

.animate-fade-in {
  animation: fadeIn 0.25s ease-out;
}

/* ===== SLIDE UP ===== */
@keyframes slideUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-slide-up {
  animation: slideUp 0.35s ease-out;
}

/* ===== CARD MOVE TRANSITION ===== */
@keyframes cardMove {
  from { transform: translate(var(--move-from-x, 0), var(--move-from-y, 0)); }
  to { transform: translate(0, 0); }
}

.animate-card-move {
  animation: cardMove 0.25s ease-out;
}

/* ===== WIN CELEBRATION ===== */
@keyframes celebrate {
  0% { transform: scale(0.3); opacity: 0; }
  50% { transform: scale(1.1); opacity: 1; }
  70% { transform: scale(0.95); }
  100% { transform: scale(1); opacity: 1; }
}

.animate-celebrate {
  animation: celebrate 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ===== PULSE (for hints) ===== */
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.8); }
  50% { box-shadow: 0 0 0 6px rgba(255, 215, 0, 0.4); }
}

.animate-pulse {
  animation: pulse 1s ease-in-out infinite;
}

/* ===== CONFETTI (win screen) ===== */
@keyframes confettiFall {
  0% { transform: translateY(-100vh) rotate(0deg); opacity: 1; }
  100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

.confetti {
  position: fixed;
  width: 8px;
  height: 8px;
  top: 0;
  z-index: 600;
  pointer-events: none;
  animation: confettiFall 3s linear forwards;
}
