/* Movimentos do site. Cada universo tem sua gramática:
   Juju quica e desabrocha; Han desamarra, levanta e assenta como papel. */

@keyframes twinkle {
  0%, 100% { opacity: 1; transform: scale(1) rotate(0deg); }
  50% { opacity: 0.55; transform: scale(0.86) rotate(12deg); }
}

@keyframes drift {
  from { transform: translateX(-4vw); }
  to { transform: translateX(4vw); }
}

@keyframes bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@keyframes bloom {
  from { opacity: 0; transform: scale(0.6) rotate(-40deg); }
  to { opacity: 1; transform: scale(1) rotate(0deg); }
}

@keyframes pop-in {
  from { opacity: 0; transform: translateY(10px) scale(0.96); }
  to { opacity: 1; transform: none; }
}

@keyframes found-burst {
  0% { transform: scale(1); }
  35% { transform: scale(1.35) rotate(18deg); }
  100% { transform: scale(1) rotate(0deg); }
}

@keyframes flash {
  0% { opacity: 0; transform: scale(0.4); }
  30% { opacity: 1; }
  100% { opacity: 0; transform: scale(1.8); }
}

@keyframes peek {
  0%, 70%, 100% { transform: translate(var(--peek-x, 0), var(--peek-y, 0)) rotate(var(--peek-r, 0deg)); }
  80% { transform: translate(calc(var(--peek-x, 0) * 0.4), calc(var(--peek-y, 0) * 0.4)) rotate(var(--peek-r, 0deg)); }
}

@keyframes swim {
  from { transform: translateX(-60px) scaleX(var(--dir, 1)); }
  to { transform: translateX(calc(var(--lake-w, 600px) + 60px)) scaleX(var(--dir, 1)); }
}

@keyframes swim-back {
  from { transform: translateX(calc(var(--lake-w, 600px) + 60px)) scaleX(-1); }
  to { transform: translateX(-60px) scaleX(-1); }
}

@keyframes wave-slide {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes bubble-up {
  0% { opacity: 0; transform: translateY(0) scale(0.7); }
  20% { opacity: 0.9; }
  100% { opacity: 0; transform: translateY(-90px) scale(1); }
}

@keyframes spin-slow {
  to { transform: rotate(360deg); }
}

@keyframes eq {
  0%, 100% { transform: scaleY(0.3); }
  50% { transform: scaleY(1); }
}

@keyframes flag-wave {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(-6deg); }
}

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