/* ============================================================
   動畫：進場、彈出、搖晃、漂浮、彩帶
   ============================================================ */
@keyframes pop-in {
  0% { opacity: 0; transform: scale(.94) translateY(10px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes slide-up {
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-7px) rotate(-.5deg); }
  40% { transform: translateX(6px) rotate(.5deg); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(3px); }
}
@keyframes bob {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-9px) rotate(1deg); }
}
@keyframes confetti-fall {
  0% { transform: translate3d(0, -20px, 0) rotate(0); opacity: 1; }
  100% { transform: translate3d(var(--dx, 0), 105vh, 0) rotate(var(--rot, 540deg)); opacity: .9; }
}
@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(233, 139, 63, .35); }
  50% { box-shadow: 0 0 0 10px rgba(233, 139, 63, 0); }
}
@keyframes score-pop {
  0% { transform: scale(1); }
  40% { transform: scale(1.18); }
  100% { transform: scale(1); }
}

.screen.is-active { animation: slide-up .25s ease; }
.zone-block { animation: slide-up .35s ease both; }
.zone-block:nth-child(2) { animation-delay: .06s; }
.zone-block:nth-child(3) { animation-delay: .12s; }
.zone-block:nth-child(4) { animation-delay: .18s; }

.pill--score.is-bump { animation: score-pop .35s ease; }
.feedback.is-show .feedback__bubble { animation: slide-up .2s ease; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}