/* Animaciones de las mascotas: respiran, parpadean, mueven la cola y saludan. */
.mascot-svg { width: 100%; height: auto; overflow: visible; display: block; }
.mascot-svg * { transform-box: fill-box; }
.mascot-svg .m-head { transform-origin: 50% 85%; animation: m-bob 3.2s ease-in-out infinite; }
.mascot-svg .m-body { transform-origin: 50% 100%; animation: m-breathe 3.2s ease-in-out infinite; }
.mascot-svg .m-eyes { transform-origin: 50% 50%; animation: m-blink 4.2s infinite; }
.mascot-svg .m-tail { transform-origin: 0% 100%; animation: m-tail 1.8s ease-in-out infinite; }
.mascot-svg .m-wag { animation-duration: .45s; }
.mascot-svg .m-ear-l { transform-origin: 80% 100%; animation: m-ear 2.6s ease-in-out infinite; }
.mascot-svg .m-ear-r { transform-origin: 20% 100%; animation: m-ear 2.6s ease-in-out infinite reverse; }
.mascot-svg .m-arm-r { transform-origin: 50% 10%; }
.mascot-svg .m-arm-l { transform-origin: 50% 10%; }

.mascot-svg.wave .m-arm-r, .mascot-svg:hover .m-arm-r { animation: m-wave .5s ease-in-out infinite alternate; }
.mascot-svg.mood-joy .m-arm-l, .mascot-svg.mood-wow .m-arm-l { animation: m-clap-l .38s ease-in-out 4; }
.mascot-svg.mood-joy .m-arm-r, .mascot-svg.mood-wow .m-arm-r { animation: m-clap-r .38s ease-in-out 4; }
.mascot-svg.mood-joy { animation: m-jump .5s cubic-bezier(.3, 1.6, .5, 1) 2; }
.mascot-svg.mood-sad .m-head { animation: none; transform: rotate(-5deg) translateY(4px); }
.mascot-svg.mood-sleep .m-head { animation: m-bob 5s ease-in-out infinite; transform: rotate(-8deg); }

@keyframes m-bob { 50% { transform: rotate(3deg) translateY(-3px); } }
@keyframes m-breathe { 50% { transform: scale(1.03, .97); } }
@keyframes m-blink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes m-tail { 50% { transform: rotate(-14deg); } }
@keyframes m-ear { 50% { transform: rotate(-6deg); } }
@keyframes m-wave { from { transform: rotate(-150deg); } to { transform: rotate(-110deg); } }
@keyframes m-clap-l { 50% { transform: rotate(40deg) translate(14px, -20px); } }
@keyframes m-clap-r { 50% { transform: rotate(-40deg) translate(-14px, -20px); } }
@keyframes m-jump { 40% { transform: translateY(-16px) scale(1.04, .97); } }

@media (prefers-reduced-motion: reduce) {
  .mascot-svg, .mascot-svg * { animation: none !important; }
}

/* Ritmo propio de cada mascota (lo pone mascots.js): --md desfase, --ms velocidad, --mb/--mk parpadeo */
.mascot-svg .m-head { animation-duration: calc(3.2s * var(--ms, 1)); animation-delay: var(--md, 0s); }
.mascot-svg .m-body { animation-duration: calc(3.2s * var(--ms, 1)); animation-delay: var(--md, 0s); }
.mascot-svg .m-tail { animation-duration: calc(1.8s * var(--ms, 1)); animation-delay: var(--md, 0s); }
.mascot-svg .m-wag { animation-duration: calc(.45s * var(--ms, 1)); }
.mascot-svg .m-ear-l, .mascot-svg .m-ear-r { animation-duration: calc(2.6s * var(--ms, 1)); animation-delay: var(--md, 0s); }
.mascot-svg .m-eyes { animation-duration: var(--mk, 4.2s); animation-delay: var(--mb, 0s); }