/* ============================================================
   ANIMATIONS — little bits of life for the interface.
   ============================================================ */
@keyframes pop { from { transform: scale(0.94); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes rise { from { transform: translate(-50%, 16px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }
@keyframes slidein { from { transform: translateX(-12px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes bob { 0%, 100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, -8px); } }
#dialog-next { animation-name: nudge; }
@keyframes nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(4px); } }
@keyframes drift { from { transform: translateX(0); } to { transform: translateX(calc(100vw + 500px)); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes slosh { 0%, 100% { transform: skewY(0deg); } 50% { transform: skewY(-3deg); } }
@keyframes shimmer { 0%, 100% { box-shadow: 0 0 0 0 rgba(245, 197, 66, 0.0); } 50% { box-shadow: 0 0 0 4px rgba(245, 197, 66, 0.5); } }
@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(245, 197, 66, 0.9); } 50% { box-shadow: 0 0 0 8px rgba(245, 197, 66, 0); } }
@keyframes mappulse { 0%, 100% { stroke: #f5c542; stroke-width: 1.2; } 50% { stroke: #fff; stroke-width: 2.4; } }
.pulse { animation: pulse 1.2s ease-in-out infinite; border-color: var(--gold) !important; }
.side.glow span { animation: wiggle 2.4s ease-in-out infinite; display: inline-block; }
@keyframes wiggle { 0%, 90%, 100% { transform: rotate(0); } 93% { transform: rotate(-12deg); } 96% { transform: rotate(12deg); } }

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