/* ============================================================
   動畫（皆在 prefers-reduced-motion 下關閉）
   ============================================================ */
@keyframes screenIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes ripple { to { transform: scale(4); opacity: 0; } }
@keyframes pulseNode { 0%, 100% { box-shadow: 0 0 0 2px rgba(255, 209, 102, 0.4), 0 0 18px rgba(255, 209, 102, 0.25); } 50% { box-shadow: 0 0 0 3px rgba(255, 209, 102, 0.7), 0 0 30px rgba(255, 209, 102, 0.5); } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes popIn { from { opacity: 0; transform: scale(0.88); } to { opacity: 1; transform: none; } }
@keyframes popBubble { 0% { opacity: 0; transform: scale(0.5) translateY(20px); } 15% { opacity: 1; transform: scale(1.08); } 25% { transform: scale(1); } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-16px); } }
@keyframes floatPts { 0% { opacity: 0; transform: translateY(10px); } 25% { opacity: 1; } 100% { opacity: 0; transform: translateY(-40px); } }
@keyframes shake { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(6px); } }
@keyframes bump { 0% { transform: scale(1); } 40% { transform: scale(1.06); } 100% { transform: scale(1); } }
@keyframes starPop { 0% { transform: scale(0.2) rotate(-40deg); opacity: 0; } 70% { transform: scale(1.35) rotate(8deg); opacity: 1; } 100% { transform: scale(1) rotate(0); opacity: 1; } }
@keyframes confettiFall { 0% { transform: translateY(0) rotate(0); opacity: 1; } 100% { transform: translateY(105vh) rotate(720deg); opacity: 0.9; } }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes flashGood { 0% { box-shadow: 0 0 0 0 rgba(93, 242, 168, 0.9); } 100% { box-shadow: 0 0 0 26px rgba(93, 242, 168, 0); } }
@keyframes flashBad { 0% { box-shadow: 0 0 0 0 rgba(255, 141, 141, 0.9); } 100% { box-shadow: 0 0 0 22px rgba(255, 141, 141, 0); } }
@keyframes overtime { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }
@keyframes twinkle { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }
@keyframes rainbow { 0% { filter: hue-rotate(0); } 100% { filter: hue-rotate(360deg); } }
@keyframes comboPop { 0% { transform: scale(1); } 40% { transform: scale(1.5); color: #ffd166; } 100% { transform: scale(1); } }

.star { animation: twinkle 3.2s ease-in-out infinite; }
.home__mascot { animation: bob 3.4s ease-in-out infinite; }
.is-shake { animation: shake 0.45s ease; }
.is-bump { animation: bump 0.18s ease; }
.fx-good { animation: flashGood 0.7s ease-out; }
.fx-bad { animation: flashBad 0.6s ease-out; }
.timer__bar i.is-warn { background: var(--warn); }
.timer__bar i.is-low { background: #ff7b7b; }
.hud__timer.is-over .timer__bar i { background: #ff7b7b; animation: overtime 0.9s infinite; }
.hud__timer.is-over .timer__num { color: #ffb4b4; font-weight: 800; }
.hud__combo b.is-pop { animation: comboPop 0.5s ease; }
.cheat-rainbow { animation: rainbow 2s linear 2; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
  .star { animation: none; }
  .home__mascot, .vis-mascot img { animation: none; }
}
