/* Lab-game mascot: an idle bounce, and a leap when cheerMascot() (mascot.js) is called — each
   game calls it on its own good moments (a line clear, a big merge, a correct digit). Placed
   bottom-right; a game can override .hud-mascot's position in its own stylesheet. */
.hud-mascot {
    position: absolute;
    right: max(16px, calc(50% - 560px));
    bottom: 2vh;
    height: min(30vh, 320px);
    width: auto;
    pointer-events: none;
    transform-origin: 50% 100%;
    filter: drop-shadow(0 12px 18px rgba(20, 10, 60, .45));
    animation: mascot-bounce 1.1s ease-in-out infinite;
}
.hud-mascot.cheer { animation: mascot-leap .8s cubic-bezier(.3, 1.5, .5, 1) 1, mascot-bounce 1.1s ease-in-out .8s infinite; }
@keyframes mascot-bounce {
    0%, 100% { transform: translateY(0) scale(1, 1); }
    40% { transform: translateY(-16px) scale(.97, 1.03); }
    85% { transform: translateY(0) scale(1.05, .95); }
}
@keyframes mascot-leap {
    0% { transform: translateY(0) scale(1.08, .9); }
    35% { transform: translateY(calc(-1 * var(--jump, 40px))) scale(.94, 1.08) rotate(-6deg); }
    60% { transform: translateY(calc(-1 * var(--jump, 40px))) rotate(6deg); }
    100% { transform: translateY(0) scale(1, 1); }
}
@media (prefers-reduced-motion: reduce) {
    .hud-mascot, .hud-mascot.cheer { animation: none; }
}
@media (max-height: 560px), (max-width: 900px) {
    .hud-mascot { display: none; }
}