/* ── DICE-style micro-animations ── */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideUpBar {
  from {
    opacity: 0;
    transform: translateY(100%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes scalePop {
  0% { transform: scale(0); opacity: 0; }
  60% { transform: scale(1.15); }
  100% { transform: scale(1); opacity: 1; }
}

@keyframes pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}

.page-enter {
  animation: fadeIn 0.45s ease both;
}

.animate-in {
  animation: fadeInUp 0.5s ease both;
}

.sticky-bar-animate {
  animation: slideUpBar 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.confirm-icon-pop {
  animation: scalePop 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero-strip {
  animation: fadeInUp 0.6s ease both;
}

.loading-pulse {
  animation: pulse 1.2s ease-in-out infinite;
}

.btn-cta:active:not(:disabled) {
  transform: scale(0.97);
  transition: transform 0.1s ease;
}

.filter-chip {
  transition: all 0.2s ease;
}

.filter-chip:active {
  transform: scale(0.96);
}

@media (prefers-reduced-motion: reduce) {
  .page-enter,
  .animate-in,
  .sticky-bar-animate,
  .confirm-icon-pop,
  .hero-strip,
  .loading-pulse,
  .dice-card:hover .dice-card-poster {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }

  .dice-card:hover {
    transform: none;
  }
}