.monster-bounce { animation: bounce 2s infinite ease-in-out; }
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.combo-text { animation: pop 1.5s ease-out forwards; }
@keyframes pop { 
    0% { transform: scale(0.5); opacity: 0; margin-top:0;} 
    20% { transform: scale(1.2); opacity: 1; margin-top:-20px;} 
    80% { transform: scale(1); opacity: 1; margin-top:-30px;} 
    100% { transform: scale(1); opacity: 0; margin-top:-40px;} 
}

/* Animaciones de Combate */
.anim-dash-player { animation: dash-p 0.3s ease-in-out; }
@keyframes dash-p { 
    0% { transform: translateX(0) scale(1.1); } 
    50% { transform: translateX(60px) scale(1.1); } 
    100% { transform: translateX(0) scale(1); } 
}

.anim-dash-enemy { animation: dash-e 0.3s ease-in-out; }
@keyframes dash-e { 
    0% { transform: translateX(0) scale(1.1); } 
    50% { transform: translateX(-60px) scale(1.1); } 
    100% { transform: translateX(0) scale(1); } 
}

.anim-shake { animation: shake 0.4s ease-in-out; filter: brightness(2) invert(0.2) sepia(1) hue-rotate(-50deg) saturate(5); }
@keyframes shake { 
    0%, 100% { transform: translateX(0); } 
    20%, 60% { transform: translateX(-10px); } 
    40%, 80% { transform: translateX(10px); } 
}

/* --- SISTEMA DE PARTÍCULAS --- */
.particle-projectile {
    position: fixed;
    pointer-events: none;
    z-index: 100;
    transition: all 0.3s cubic-bezier(0.5, 0, 0.8, 0.2); /* Aceleración de proyectil */
    font-size: 2.5rem;
    filter: drop-shadow(0px 0px 10px currentColor);
}

@keyframes thunder-strike {
    0% { opacity: 0; transform: translateY(-150px) scaleY(2.5); }
    20% { opacity: 1; transform: translateY(0) scaleY(1); }
    80% { opacity: 1; transform: translateY(0) scaleY(1); filter: brightness(2); }
    100% { opacity: 0; transform: translateY(0) scaleY(1); }
}

.anim-thunder-strike {
    animation: thunder-strike 0.4s ease-out forwards;
}

/* Animaci贸n del Fondo Din谩mico */
.bg-pan { 
    background-size: cover; 
    animation: pan 60s linear infinite alternate; 
}
@keyframes pan { 
    0% { background-position: left center; } 
    100% { background-position: right center; } 
}

.bytemon-sprite {
    width: 100%;
    height: 140px; /* Altura base un poco más grande */
    object-fit: contain; 
    object-position: bottom;
    
    /* TRUCO: Escala la imagen visualmente sin empujar otros elementos de la UI */
    transform: scale(1.4); /* Aumenta un 40% su tamaño visual. Súbelo a 1.6 o 1.8 si aún los ves pequeños */
    transform-origin: bottom center; /* Asegura que al crecer, los pies sigan tocando el "suelo" */
    
    /* Opcional: Suaviza la animación si decides cambiar su tamaño dinámicamente luego */
    transition: transform 0.2s ease-in-out;
}

/* Ajuste automático para pantallas más grandes (PC/Tablets) */
@media (min-width: 768px) {
    .bytemon-sprite {
        height: 180px; 
        transform: scale(1.6); /* Aún más grandes en PC */
    }
}