/* Desert world and Main Street: animations and styles (js/worlds/desert*.js, js/worlds/town*.js) */

/* desert: a camel nodding, ripples on the oasis, tumbleweeds, a bobbing sign, hanging things swaying, the flying carpet */
.dz-nod { animation: dzNod 3.6s ease-in-out infinite; }
@keyframes dzNod { 0%, 100% { transform: rotate(0); } 40% { transform: rotate(-7deg); } 60% { transform: rotate(-5deg); } }
.dz-ripple { transform-box: fill-box; transform-origin: center; animation: dzRipple 3.2s ease-out infinite; }
@keyframes dzRipple { from { transform: scale(.5); opacity: .9; } to { transform: scale(1.5); opacity: 0; } }
.dz-tumble { animation: dzTumble 38s linear infinite; }
@keyframes dzTumble { from { transform: translateX(0); } to { transform: translateX(4200px); } }
.dz-roll { transform-box: fill-box; transform-origin: center; animation: dzRoll 2.4s linear infinite; }
@keyframes dzRoll { to { transform: rotate(360deg); } }
.dz-hop { animation: dzHop .8s ease-in-out infinite; }
@keyframes dzHop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
.dz-bob { animation: dzBob 3s ease-in-out infinite; }
@keyframes dzBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.dz-sway { animation: dzSway 5s ease-in-out infinite; }
@keyframes dzSway { 0%, 100% { transform: rotate(-1.6deg); } 50% { transform: rotate(1.6deg); } }
.dz-hover { animation: dzHover 2.8s ease-in-out infinite; }
@keyframes dzHover { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* Main Street: wagging tails, a bouncing ice cream sign, hopping pets, soft ice pouring, twitching bunny ears */
.tw-wag { animation: twWag .5s ease-in-out infinite alternate; }
@keyframes twWag { from { transform: rotate(-14deg); } to { transform: rotate(16deg); } }
.tw-bounce { transform-box: fill-box; transform-origin: 50% 100%; animation: twBounce 2.6s ease-in-out infinite; }
@keyframes twBounce { 0%, 100% { transform: translateY(0) scale(1); } 45% { transform: translateY(-8px) scale(1.02, .98); } 60% { transform: translateY(0) scale(1.04, .96); } }
.tw-hop { animation: twHop .6s cubic-bezier(.3, 1.4, .5, 1) infinite; }
@keyframes twHop { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(-16px); } }
.tw-pour { transform-box: fill-box; transform-origin: 50% 0%; animation: twPour .9s ease-in-out infinite; }
@keyframes twPour { 0% { transform: scaleY(.2); opacity: .6; } 50% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(.8); opacity: .9; } }
.tw-grow { transform-box: fill-box; transform-origin: 50% 100%; animation: twGrow 1.8s ease-out both; }
@keyframes twGrow { from { transform: scale(.2); } to { transform: scale(1); } }
.tw-ears { animation: twEars 3.2s ease-in-out infinite; }
@keyframes twEars { 0%, 80%, 100% { transform: rotate(0); } 85% { transform: rotate(-10deg); } 90% { transform: rotate(6deg); } }

@media (prefers-reduced-motion: reduce) {
  .dz-nod, .dz-ripple, .dz-tumble, .dz-roll, .dz-hop, .dz-bob, .dz-sway, .dz-hover,
  .tw-wag, .tw-bounce, .tw-hop, .tw-pour, .tw-grow, .tw-ears { animation: none !important; }
}
