@keyframes pulsePossibleMove {
  0% {
    box-shadow: 0 0 15px #00e2ff88, 0 0 25px #00e2ff44;
    border-color: #00e2ff;
  }
  50% {
    box-shadow: 0 0 25px #00e2ffaa, 0 0 35px #00e2ff66;
    border-color: #3cefff;
  }
  100% {
    box-shadow: 0 0 15px #00e2ff88, 0 0 25px #00e2ff44;
    border-color: #00e2ff;
  }
}

@keyframes pulseBerserkMove {
  0% {
    box-shadow: 0 0 15px #DC143C88, 0 0 25px #DC143C44;
    border-color: #DC143C;
  }
  50% {
    box-shadow: 0 0 25px #DC143Caa, 0 0 35px #DC143C66;
    border-color: #FF1744;
  }
  100% {
    box-shadow: 0 0 15px #DC143C88, 0 0 25px #DC143C44;
    border-color: #DC143C;
  }
}

@keyframes portalSwirl {
  0% {
    transform: rotate(0deg) scale(1);
  }
  50% {
    transform: rotate(180deg) scale(1.1);
  }
  100% {
    transform: rotate(360deg) scale(1);
  }
}

/* OPTIMIZED JUMP AND IMPACT ANIMATIONS FOR FAST GAMEPLAY */

/* Ultra-fast, optimized jump animation for smooth gameplay */
@keyframes tokenJump {
  0% { transform: translate3d(-50%, -50%, 0) scale(1); }
  40% { transform: translate3d(-50%, -105%, 0) scale(1.08); }
  70% { transform: translate3d(-50%, -50%, 0) scale(1.12); }
  85% { transform: translate3d(-50%, -55%, 0) scale(1.04); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

/* Fast, snappy impact animation */
@keyframes tokenImpact {
  0% { transform: translate3d(-50%, -105%, 0) scale(1.08); }
  30% { transform: translate3d(-50%, -50%, 0) scale(1.12); box-shadow: 0 0 20px currentColor; }
  50% { transform: translate3d(-50%, -55%, 0) scale(1.04); }
  70% { transform: translate3d(-50%, -50%, 0) scale(1.02); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

/* Faster cell impact effect */
@keyframes cellImpact {
  0% { transform: scale(1); }
  25% { transform: scale(1.06); box-shadow: 0 0 15px #00e2ff88, 0 0 25px #00e2ff44; border-color: #00e2ff; }
  50% { transform: scale(1.03); box-shadow: 0 0 12px #00e2ffaa, 0 0 20px #00e2ff66; }
  100% { transform: scale(1); }
}

/* SPEED-OPTIMIZED SCREEN SHAKE - Faster and less intrusive */
@keyframes screenShake {
  0% { transform: translate(0, 0); }
  20% { transform: translate(-1px, -1px); }
  40% { transform: translate(1px, 1px); }
  60% { transform: translate(-1px, 0px); }
  80% { transform: translate(1px, -1px); }
  100% { transform: translate(0, 0); }
}

/* Faster dramatic shake */
@keyframes screenShakeDramatic {
  0% { transform: translate(0, 0) rotate(0deg); }
  15% { transform: translate(-6px, -4px) rotate(-0.6deg); }
  30% { transform: translate(5px, 6px) rotate(0.6deg); }
  45% { transform: translate(-4px, -2px) rotate(-0.3deg); }
  60% { transform: translate(5px, -3px) rotate(0.5deg); }
  75% { transform: translate(-3px, 4px) rotate(-0.4deg); }
  90% { transform: translate(2px, 2px) rotate(0.2deg); }
  100% { transform: translate(0, 0) rotate(0); }
}

.shaking {
  animation: screenShake 0.25s ease-in-out;
}

/* Powerup animations */
@keyframes powerupFloat {
  0% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-4px) scale(1.05); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes powerupCollect {
  0% { transform: scale(1); }
  50% { transform: scale(1.5); opacity: 0.9; }
  100% { transform: scale(0); opacity: 0; }
}

@keyframes powerupSpawn {
  0% { transform: scale(0); opacity: 0; }
  70% { transform: scale(1.2); opacity: 0.9; }
  85% { transform: scale(0.95); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

/* Enemy spawn animation */
@keyframes enemySpawn {
  0% { transform: translate3d(-50%, -50%, 0) scale(0) rotate(180deg); opacity: 0; }
  50% { transform: translate3d(-50%, -50%, 0) scale(1.15) rotate(0deg); opacity: 0.9; }
  75% { transform: translate3d(-50%, -50%, 0) scale(0.95) rotate(0deg); opacity: 1; }
  100% { transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg); opacity: 1; }
}

/* Enemy crystallization animation - modified to bump instead of ascend */
@keyframes enemyCrystallize {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg); 
    filter: brightness(1) saturate(1);
    box-shadow: var(--enemy-glow);
    border-color: #3a1c29;
    background: radial-gradient(circle at 30% 30%, #ff86a3 10%, var(--enemy) 60%);
  }
  15% { 
    transform: translate3d(-45%, -45%, 0) scale(1.08) rotate(0deg); 
    filter: brightness(1.4) saturate(1.1);
  }
  40% { 
    transform: translate3d(-40%, -40%, 0) scale(1.12) rotate(3deg); 
    background: radial-gradient(circle at 30% 30%, #b3f4ff 10%, #3cefff 60%);
    border-color: #3a466c;
    filter: brightness(1.6) saturate(0.9) contrast(1.1);
    box-shadow: 0 0 15px #00fff7, 0 0 25px #00ffee88;
  }
  100% { 
    transform: translate3d(-40%, -40%, 0) scale(1.12) rotate(3deg); 
    background: radial-gradient(circle at 30% 30%, #c9fbff 10%, #54d9ff 60%);
    border-color: #3a466c;
    filter: brightness(1.6) saturate(0.9) contrast(1.1);
    box-shadow: 0 0 15px #00fff7, 0 0 25px #00ffee88;
  }
}

/* Enemy shatter animation - modified for bump effect */
@keyframes enemyShatter {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1.2) rotate(3deg); 
    opacity: 1;
    filter: brightness(1.8) saturate(1.8) contrast(1.3);
    box-shadow: 0 0 30px #fff, 0 0 50px #ff3e6b;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
  10% { 
    transform: translate3d(-50%, -50%, 0) scale(1.4) rotate(3deg); 
    opacity: 1;
    filter: brightness(2.2) saturate(2.2) contrast(1.8);
    box-shadow: 0 0 40px #fff, 0 0 65px #ff3e6b;
  }
  25% { 
    transform: translate3d(-50%, -50%, 0) scale(1.3) rotate(0deg); 
    opacity: 0.95;
    filter: brightness(2) saturate(1.8) contrast(1.5);
    clip-path: polygon(50% 0%, 0% 15%, 20% 40%, 0% 70%, 30% 100%, 70% 90%, 100% 100%, 90% 60%, 100% 30%, 75% 0%);
  }
  60% { 
    transform: translate3d(-45%, -45%, 0) scale(1.05) rotate(6deg); 
    opacity: 0.8;
    filter: brightness(1.5) saturate(1.1) contrast(1.2);
  }
  100% { 
    transform: translate3d(-48%, -48%, 0) scale(0.3) rotate(8deg); 
    opacity: 0;
    filter: brightness(1.2) saturate(0.7) contrast(1.1);
    clip-path: polygon(20% 0%, 0% 10%, 15% 25%, 0% 45%, 20% 65%, 45% 55%, 60% 65%, 55% 40%, 70% 25%, 45% 0%);
  }
}

/* Extended jump animation with more suspension */
@keyframes tokenJumpExtended {
  0% { transform: translate3d(-50%, -50%, 0) scale(1); }
  25% { transform: translate3d(-50%, -110%, 0) scale(1.08); }
  40% { transform: translate3d(-50%, -160%, 0) scale(1.12); }
  55% { transform: translate3d(-50%, -170%, 0) scale(1.08); }
  70% { transform: translate3d(-50%, -160%, 0) scale(1.04); }
  85% { transform: translate3d(-50%, -130%, 0) scale(1.02); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

@keyframes powerupPulse {
  0% {
    box-shadow: 0 0 15px rgba(0, 247, 255, 0.6), 0 0 25px rgba(0, 247, 255, 0.3);
  }
  100% {
    box-shadow: 0 0 20px rgba(0, 247, 255, 0.8), 0 0 30px rgba(0, 247, 255, 0.5);
  }
}

@keyframes powerupRingPulse {
  0% { transform: scale(1); opacity: 0.5; }
  50% { transform: scale(1.1); opacity: 0.8; }
  100% { transform: scale(1); opacity: 0.5; }
}

/* Player defeat animation */
@keyframes playerDefeat {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg);
    opacity: 1;
    filter: brightness(1) saturate(1);
    box-shadow: var(--player-glow);
    background: radial-gradient(circle at 30% 30%, #73f5ff 10%, var(--player) 60%);
  }
  20% { 
    transform: translate3d(-50%, -50%, 0) scale(1.3) rotate(5deg);
    opacity: 1;
    filter: brightness(1.5) saturate(1.5);
    box-shadow: 0 0 25px #ff4f65, 0 0 35px #ff4f6588;
    background: radial-gradient(circle at 30% 30%, #ff9eae 10%, #ff4f65 60%);
  }
  40% { 
    transform: translate3d(-50%, -50%, 0) scale(1.1) rotate(-8deg);
    opacity: 0.9;
    background: radial-gradient(circle at 30% 30%, #ff9eae 10%, #ff4f65 60%);
    filter: brightness(1.3) saturate(1.3);
  }
  60% { 
    transform: translate3d(-50%, -50%, 0) scale(1.05) rotate(5deg);
    opacity: 0.7;
    background: radial-gradient(circle at 30% 30%, #ff7a91 10%, #ff3a56 60%);
    filter: brightness(1.2) saturate(1.1);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(0.2) rotate(10deg);
    opacity: 0;
    background: radial-gradient(circle at 30% 30%, #ff5a73 10%, #ff2642 60%);
    filter: brightness(0.8) saturate(0.7);
  }
}

/* Meditation animation */
@keyframes playerMeditate {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1);
    box-shadow: var(--player-glow);
    filter: brightness(1) saturate(1);
  }
  25% { 
    transform: translate3d(-50%, -50%, 0) scale(1.1);
    box-shadow: 0 0 20px #19ffb9, 0 0 30px #19ffb988;
    filter: brightness(1.2) saturate(1.2);
  }
  50% { 
    transform: translate3d(-50%, -50%, 0) scale(1.15);
    box-shadow: 0 0 25px #19ffb9, 0 0 35px #19ffb988;
    filter: brightness(1.3) saturate(1.3);
  }
  75% { 
    transform: translate3d(-50%, -50%, 0) scale(1.1);
    box-shadow: 0 0 20px #19ffb9, 0 0 30px #19ffb988;
    filter: brightness(1.2) saturate(1.2);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(1);
    box-shadow: var(--player-glow);
    filter: brightness(1) saturate(1);
  }
}

/* Player bleeding animation */
@keyframes playerBleed {
  0% {
    transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg);
    filter: brightness(1) saturate(1);
    box-shadow: var(--player-glow);
  }
  30% {
    transform: translate3d(-50%, -50%, 0) scale(1.1) rotate(-3deg);
    filter: brightness(1.3) saturate(1.2);
    box-shadow: 0 0 20px #ff4f65, 0 0 30px #ff4f6588;
  }
  60% {
    transform: translate3d(-50%, -50%, 0) scale(0.95) rotate(3deg);
    filter: brightness(1.2) saturate(1.1);
    box-shadow: 0 0 15px #ff4f65, 0 0 25px #ff4f6588;
  }
  100% {
    transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg);
    filter: brightness(1) saturate(1);
    box-shadow: var(--player-glow);
  }
}

/* Unique effects for character actions */
@keyframes meditateEffect {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    opacity: 1; 
    filter: brightness(1);
  }
  50% { 
    transform: translate3d(-50%, -50%, 0) scale(1.2); 
    opacity: 0.8; 
    box-shadow: 0 0 20px #FF8C00, 0 0 30px #FF8C0088;
    filter: brightness(1.3) saturate(1.2);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    opacity: 1;
    filter: brightness(1);
  }
}

@keyframes ArcherEffect {
  0% { transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg); }
  30% { transform: translate3d(-50%, -50%, 0) scale(1.1) rotate(-5deg); }
  60% { transform: translate3d(-50%, -50%, 0) scale(1.15) rotate(5deg); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg); }
}

@keyframes BanditEffect {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    opacity: 1;
    filter: brightness(1);
  }
  30% { 
    transform: translate3d(-50%, -50%, 0) scale(0.8); 
    opacity: 0.7;
    filter: brightness(0.8) saturate(0.9);
  }
  70% { 
    transform: translate3d(-50%, -50%, 0) scale(1.2); 
    opacity: 0.9;
    filter: brightness(1.4) saturate(1.3);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    opacity: 1;
    filter: brightness(1);
  }
}

@keyframes GuardianCounterEffect {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    box-shadow: 0 0 14px #1E5799, 0 0 24px #1E579988;
    filter: brightness(1) saturate(1);
  }
  30% { 
    transform: translate3d(-50%, -50%, 0) scale(1.2); 
    box-shadow: 0 0 25px #FFD700, 0 0 40px #FFD70088;
    filter: brightness(1.5) saturate(1.3);
  }
  70% { 
    transform: translate3d(-50%, -50%, 0) scale(1.15) rotate(5deg); 
    box-shadow: 0 0 30px #FFD700, 0 0 50px #FFD70088;
    filter: brightness(1.8) saturate(1.5);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    box-shadow: 0 0 14px #1E5799, 0 0 24px #1E579988;
    filter: brightness(1) saturate(1);
  }
}

@keyframes fadeIn {
  from { opacity: 0 }
  to { opacity: 1 }
}

@keyframes float-up {
  0% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(-50px) scale(1.2);
  }
}

/* Crystal shards for shattering effect */
@keyframes shardFly1 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translate(-30px, -40px) rotate(-45deg) scale(0.1); opacity: 0; }
}

@keyframes shardFly2 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translate(35px, -30px) rotate(65deg) scale(0.1); opacity: 0; }
}

@keyframes shardFly3 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translate(-25px, 40px) rotate(-65deg) scale(0.1); opacity: 0; }
}

@keyframes shardFly4 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translate(30px, 40px) rotate(45deg) scale(0.1); opacity: 0; }
}

@keyframes shardFly5 {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translate(0px, -50px) rotate(0deg) scale(0.1); opacity: 0; }
}

/* Animation for score and difficulty changes */
@keyframes value-pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

.value-change {
  animation: value-pulse 0.5s ease;
}

@keyframes score-entry-fade {
  from {
    transform: translateY(-10px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@keyframes counterLinkEffect {
  0% {
    opacity: 0;
    height: 1px;
  }
  20% {
    opacity: 1;
    height: 2px;
  }
  80% {
    opacity: 1;
    height: 3px;
  }
  100% {
    opacity: 0;
    height: 1px;
  }
}

@keyframes pulsePlan {
  0% {
    box-shadow: 0 0 10px rgba(255, 62, 107, 0.2);
    border-color: rgba(255, 62, 107, 0.4);
  }
  50% {
    box-shadow: 0 0 15px rgba(255, 62, 107, 0.4);
    border-color: rgba(255, 62, 107, 0.6);
  }
  100% {
    box-shadow: 0 0 10px rgba(255, 62, 107, 0.2);
    border-color: rgba(255, 62, 107, 0.4);
  }
}

@keyframes pulseAttack {
  0%, 100% {
    background: rgba(255, 0, 0, 0.15);
    box-shadow: 0 0 5px rgba(255, 0, 0, 0.3);
  }
  50% {
    background: rgba(255, 0, 0, 0.25);
    box-shadow: 0 0 15px rgba(255, 0, 0, 0.6);
  }
}

@keyframes berserkEffect {
  0% {
    transform: translate3d(-50%, -50%, 0) scale(1);
    box-shadow: 0 0 14px #8B0000, 0 0 24px #8B000088;
    filter: brightness(1);
  }
  25% {
    transform: translate3d(-50%, -50%, 0) scale(1.1);
    box-shadow: 0 0 20px #8B0000, 0 0 40px #8B0000;
    filter: brightness(1.3);
  }
  50% {
    transform: translate3d(-50%, -50%, 0) scale(0.95);
    box-shadow: 0 0 30px #8B0000, 0 0 60px #8B0000;
    filter: brightness(1.6) saturate(1.4);
  }
  75% {
    transform: translate3d(-50%, -50%, 0) scale(1.05);
    box-shadow: 0 0 25px #8B0000, 0 0 50px #8B0000;
    filter: brightness(1.4) saturate(1.2);
  }
  100% {
    transform: translate3d(-50%, -50%, 0) scale(1);
    box-shadow: 0 0 14px #8B0000, 0 0 24px #8B000088;
    filter: brightness(1);
  }
}

@keyframes WizardEffect {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    box-shadow: 0 0 14px #8A2BE2, 0 0 24px #8A2BE288;
    filter: brightness(1) saturate(1);
  }
  30% { 
    transform: translate3d(-50%, -50%, 0) scale(1.15) rotate(-5deg); 
    box-shadow: 0 0 25px #8A2BE2, 0 0 40px #8A2BE2;
    filter: brightness(1.3) saturate(1.2);
  }
  60% { 
    transform: translate3d(-50%, -50%, 0) scale(1.2) rotate(5deg); 
    box-shadow: 0 0 30px #8A2BE2, 0 0 50px #8A2BE2;
    filter: brightness(1.5) saturate(1.4);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    box-shadow: 0 0 14px #8A2BE2, 0 0 24px #8A2BE288;
    filter: brightness(1) saturate(1);
  }
}

@keyframes MageEffect {
  0% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    box-shadow: 0 0 14px #4B0082, 0 0 24px #4B008288;
    filter: brightness(1) saturate(1) hue-rotate(0deg);
  }
  25% { 
    transform: translate3d(-50%, -50%, 0) scale(1.2) rotate(-10deg); 
    box-shadow: 0 0 30px #4B0082, 0 0 50px #4B0082;
    filter: brightness(1.4) saturate(1.3) hue-rotate(-10deg);
  }
  50% { 
    transform: translate3d(-50%, -50%, 0) scale(1.3) rotate(10deg); 
    box-shadow: 0 0 40px #4B0082, 0 0 70px #4B0082;
    filter: brightness(1.6) saturate(1.5) hue-rotate(10deg);
  }
  75% { 
    transform: translate3d(-50%, -50%, 0) scale(1.15) rotate(-5deg); 
    box-shadow: 0 0 35px #4B0082, 0 0 60px #4B0082;
    filter: brightness(1.5) saturate(1.4) hue-rotate(-5deg);
  }
  100% { 
    transform: translate3d(-50%, -50%, 0) scale(1); 
    box-shadow: 0 0 14px #4B0082, 0 0 24px #4B008288;
    filter: brightness(1) saturate(1) hue-rotate(0deg);
  }
}

@keyframes pulseBerserk {
  0%, 100% {
    background: #3a1515;
    box-shadow: 0 0 20px #8B000088, 0 0 30px #8B000044;
  }
  50% {
    background: #5a2020;
    box-shadow: 0 0 30px #8B0000, 0 0 50px #8B000088;
  }
}

/* OPTIMIZED MOVEMENT ANIMATION CLASSES */
.enemy.jumping {
  animation: tokenJump 0.15s ease-out;
}

.player.jumping {
  animation: tokenJump 0.25s ease-out;
}

/* Rock sliding animations for obstacle pushing */
@keyframes rockSlideUp {
  0% { 
    transform: translateY(0) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  }
  20% { 
    transform: translateY(-3px) scale(1.1) rotate(-2deg); 
    filter: brightness(1.1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
  50% { 
    transform: translateY(-8px) scale(1.15) rotate(-1deg); 
    filter: brightness(1.2);
    box-shadow: 0 6px 12px rgba(0,0,0,0.5);
  }
  80% { 
    transform: translateY(-25px) scale(1.05) rotate(1deg); 
    filter: brightness(1.1);
    box-shadow: 0 8px 16px rgba(0,0,0,0.6);
  }
  100% { 
    transform: translateY(-40px) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
}

@keyframes rockSlideDown {
  0% { 
    transform: translateY(0) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  }
  20% { 
    transform: translateY(3px) scale(1.1) rotate(2deg); 
    filter: brightness(1.1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
  50% { 
    transform: translateY(8px) scale(1.15) rotate(1deg); 
    filter: brightness(1.2);
    box-shadow: 0 6px 12px rgba(0,0,0,0.5);
  }
  80% { 
    transform: translateY(25px) scale(1.05) rotate(-1deg); 
    filter: brightness(1.1);
    box-shadow: 0 8px 16px rgba(0,0,0,0.6);
  }
  100% { 
    transform: translateY(40px) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
}

@keyframes rockSlideLeft {
  0% { 
    transform: translateX(0) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  }
  20% { 
    transform: translateX(-3px) scale(1.1) rotate(-2deg); 
    filter: brightness(1.1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
  50% { 
    transform: translateX(-8px) scale(1.15) rotate(-1deg); 
    filter: brightness(1.2);
    box-shadow: 0 6px 12px rgba(0,0,0,0.5);
  }
  80% { 
    transform: translateX(-25px) scale(1.05) rotate(1deg); 
    filter: brightness(1.1);
    box-shadow: 0 8px 16px rgba(0,0,0,0.6);
  }
  100% { 
    transform: translateX(-40px) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
}

@keyframes rockSlideRight {
  0% { 
    transform: translateX(0) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  }
  20% { 
    transform: translateX(3px) scale(1.1) rotate(2deg); 
    filter: brightness(1.1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
  50% { 
    transform: translateX(8px) scale(1.15) rotate(1deg); 
    filter: brightness(1.2);
    box-shadow: 0 6px 12px rgba(0,0,0,0.5);
  }
  80% { 
    transform: translateX(25px) scale(1.05) rotate(-1deg); 
    filter: brightness(1.1);
    box-shadow: 0 8px 16px rgba(0,0,0,0.6);
  }
  100% { 
    transform: translateX(40px) scale(1) rotate(0deg); 
    filter: brightness(1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  }
}

.obstacle.sliding-up {
  animation: rockSlideUp 0.3s ease-out;
}

.obstacle.sliding-down {
  animation: rockSlideDown 0.3s ease-out;
}

.obstacle.sliding-left {
  animation: rockSlideLeft 0.3s ease-out;
}

.obstacle.sliding-right {
  animation: rockSlideRight 0.3s ease-out;
}

/* Character pushing animations */
@keyframes characterPushRight {
  0% { transform: translate3d(-50%, -50%, 0) scale(1); }
  30% { transform: translate3d(-45%, -50%, 0) scale(1.05) rotate(3deg); }
  70% { transform: translate3d(-45%, -50%, 0) scale(1.05) rotate(3deg); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

@keyframes characterPushLeft {
  0% { transform: translate3d(-50%, -50%, 0) scale(1); }
  30% { transform: translate3d(-55%, -50%, 0) scale(1.05) rotate(-3deg); }
  70% { transform: translate3d(-55%, -50%, 0) scale(1.05) rotate(-3deg); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

@keyframes characterPushUp {
  0% { transform: translate3d(-50%, -50%, 0) scale(1); }
  30% { transform: translate3d(-50%, -45%, 0) scale(1.05) rotate(-2deg); }
  70% { transform: translate3d(-50%, -45%, 0) scale(1.05) rotate(-2deg); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

@keyframes characterPushDown {
  0% { transform: translate3d(-50%, -50%, 0) scale(1); }
  30% { transform: translate3d(-50%, -55%, 0) scale(1.05) rotate(2deg); }
  70% { transform: translate3d(-50%, -55%, 0) scale(1.05) rotate(2deg); }
  100% { transform: translate3d(-50%, -50%, 0) scale(1); }
}

.player.pushing-right {
  animation: characterPushRight 0.3s ease-out;
}

.player.pushing-left {
  animation: characterPushLeft 0.3s ease-out;
}

.player.pushing-up {
  animation: characterPushUp 0.3s ease-out;
}

.player.pushing-down {
  animation: characterPushDown 0.3s ease-out;
}

/* General pushing effect */
.player.pushing {
  box-shadow: 0 0 15px rgba(255, 200, 100, 0.6), 0 0 25px rgba(255, 200, 100, 0.3);
  filter: brightness(1.2) saturate(1.1);
}

/* Rock collision animations for enemies hit by rocks */
@keyframes rockCollisionImpact {
  0% { 
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    filter: brightness(1) saturate(1);
    box-shadow: var(--enemy-glow);
  }
  15% { 
    transform: translate(-45%, -45%) scale(1.4) rotate(-8deg);
    filter: brightness(2) saturate(1.5) contrast(1.3);
    box-shadow: 0 0 25px #FF4500, 0 0 40px #FF6347, 0 0 60px #FFA500;
  }
  30% { 
    transform: translate(-40%, -40%) scale(1.6) rotate(5deg);
    filter: brightness(2.5) saturate(2) contrast(1.5);
    box-shadow: 0 0 35px #FF4500, 0 0 50px #FF6347, 0 0 80px #FFA500;
  }
  50% { 
    transform: translate(-42%, -42%) scale(1.3) rotate(-3deg);
    filter: brightness(2) saturate(1.8) contrast(1.4);
    box-shadow: 0 0 30px #DC143C, 0 0 45px #FF4500, 0 0 70px #FFA500;
  }
  70% { 
    transform: translate(-48%, -48%) scale(1.1) rotate(2deg);
    filter: brightness(1.5) saturate(1.3) contrast(1.2);
    box-shadow: 0 0 20px #B22222, 0 0 35px #DC143C, 0 0 50px #FF4500;
  }
  100% { 
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    filter: brightness(1) saturate(1) contrast(1);
    box-shadow: var(--enemy-glow);
  }
}

.enemy.rock-collision {
  animation: rockCollisionImpact 0.5s ease-out;
}

/* Rock collision animations for player characters hit by rocks */
@keyframes playerRockCollisionImpact {
  0% { 
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    filter: brightness(1) saturate(1);
    box-shadow: var(--player-glow);
  }
  15% { 
    transform: translate(-45%, -45%) scale(1.4) rotate(-8deg);
    filter: brightness(2) saturate(1.5) contrast(1.3);
    box-shadow: 0 0 25px #FF4500, 0 0 40px #FF6347, 0 0 60px #FFA500;
  }
  30% { 
    transform: translate(-40%, -40%) scale(1.6) rotate(5deg);
    filter: brightness(2.5) saturate(2) contrast(1.5);
    box-shadow: 0 0 35px #FF4500, 0 0 50px #FF6347, 0 0 80px #FFA500;
  }
  50% { 
    transform: translate(-42%, -42%) scale(1.3) rotate(-3deg);
    filter: brightness(2) saturate(1.8) contrast(1.4);
    box-shadow: 0 0 30px #DC143C, 0 0 45px #FF4500, 0 0 70px #FFA500;
  }
  70% { 
    transform: translate(-48%, -48%) scale(1.1) rotate(2deg);
    filter: brightness(1.5) saturate(1.3) contrast(1.2);
    box-shadow: 0 0 20px #B22222, 0 0 35px #DC143C, 0 0 50px #FF4500;
  }
  100% { 
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    filter: brightness(1) saturate(1) contrast(1);
    box-shadow: var(--player-glow);
  }
}

.player.rock-collision {
  animation: playerRockCollisionImpact 0.5s ease-out;
}

/* Enhanced Mobile Touch Feedback */
@keyframes touchRipple {
  0% {
    transform: scale(0);
    opacity: 0.8;
  }
  100% {
    transform: scale(4);
    opacity: 0;
  }
}

/* Enhanced Cell Selection Feedback */
@keyframes cellSelectPulse {
  0% {
    transform: scale(1) rotate(0deg);
    box-shadow: 0 0 20px var(--primary), 0 0 40px var(--primary);
  }
  25% {
    transform: scale(1.05) rotate(1deg);
  }
  50% {
    transform: scale(1.1) rotate(0deg);
    box-shadow: 0 0 30px var(--primary), 0 0 60px var(--primary);
  }
  75% {
    transform: scale(1.05) rotate(-1deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
    box-shadow: 0 0 20px var(--primary), 0 0 40px var(--primary);
  }
}

/* OPTIMIZED ACTION ANIMATIONS FOR FAST GAMEPLAY */

/* Faster move success animation */
@keyframes moveSuccess {
  0% {
    transform: translate3d(-50%, -50%, 0) scale(1);
    filter: brightness(1);
  }
  30% {
    transform: translate3d(-50%, -50%, 0) scale(1.15);
    filter: brightness(1.4) saturate(1.4);
  }
  60% {
    transform: translate3d(-50%, -50%, 0) scale(0.98);
    filter: brightness(1.15) saturate(1.15);
  }
  100% {
    transform: translate3d(-50%, -50%, 0) scale(1);
    filter: brightness(1);
  }
}

/* Faster attack success animation */
@keyframes attackSuccess {
  0% {
    transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg);
  }
  20% {
    transform: translate3d(-50%, -50%, 0) scale(1.25) rotate(4deg);
    filter: brightness(1.8) contrast(1.4);
  }
  40% {
    transform: translate3d(-50%, -50%, 0) scale(1.3) rotate(-4deg);
    filter: brightness(2.2) contrast(1.8);
  }
  60% {
    transform: translate3d(-50%, -50%, 0) scale(1.15) rotate(2deg);
    filter: brightness(1.6) contrast(1.4);
  }
  80% {
    transform: translate3d(-50%, -50%, 0) scale(1.05) rotate(-1deg);
    filter: brightness(1.2);
  }
  100% {
    transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg);
    filter: brightness(1);
  }
}

/* Faster damage shake */
@keyframes damageShake {
  0%, 100% { transform: translate3d(-50%, -50%, 0); }
  15% { transform: translate3d(-54px, -50%, 0); }
  30% { transform: translate3d(-46px, -50%, 0); }
  45% { transform: translate3d(-53px, -50%, 0); }
  60% { transform: translate3d(-47px, -50%, 0); }
  75% { transform: translate3d(-52px, -50%, 0); }
  90% { transform: translate3d(-49px, -50%, 0); }
}

/* Faster ability activation */
@keyframes abilityActivate {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 215, 0, 0.8);
    transform: translate3d(-50%, -50%, 0) scale(1);
  }
  30% {
    box-shadow: 0 0 0 12px rgba(255, 215, 0, 0.5);
    transform: translate3d(-50%, -50%, 0) scale(1.04);
  }
  60% {
    box-shadow: 0 0 0 24px rgba(255, 215, 0, 0.25);
    transform: translate3d(-50%, -50%, 0) scale(1.08);
  }
  100% {
    box-shadow: 0 0 0 40px rgba(255, 215, 0, 0);
    transform: translate3d(-50%, -50%, 0) scale(1);
  }
}

/* Mobile-optimized powerup collection */
@keyframes powerupCollectMobile {
  0% { 
    transform: scale(1) rotate(0deg);
    opacity: 1;
  }
  30% {
    transform: scale(1.8) rotate(180deg);
    opacity: 0.9;
    filter: brightness(2) saturate(2);
  }
  60% {
    transform: scale(2.5) rotate(360deg);
    opacity: 0.5;
    filter: brightness(3) saturate(3);
  }
  100% { 
    transform: scale(0) rotate(540deg);
    opacity: 0;
  }
}

/* Mobile-friendly combo counter animation */
@keyframes comboPopMobile {
  0% {
    transform: scale(0) rotate(0deg);
    opacity: 0;
  }
  30% {
    transform: scale(1.5) rotate(10deg);
    opacity: 1;
  }
  50% {
    transform: scale(1.3) rotate(-5deg);
  }
  70% {
    transform: scale(1.4) rotate(5deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
  }
}

/* Mobile score popup animation */
@keyframes scorePopupMobile {
  0% {
    transform: translateY(0) scale(0.5);
    opacity: 0;
  }
  20% {
    transform: translateY(-20px) scale(1.2);
    opacity: 1;
  }
  40% {
    transform: translateY(-40px) scale(1.3);
  }
  60% {
    transform: translateY(-60px) scale(1.2);
  }
  80% {
    transform: translateY(-80px) scale(1.1);
    opacity: 0.8;
  }
  100% {
    transform: translateY(-100px) scale(1);
    opacity: 0;
  }
}

/* Enhanced button press animation */
@keyframes buttonPressMobile {
  0% {
    transform: scale(1) translateY(0);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  }
  50% {
    transform: scale(0.95) translateY(2px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  }
  100% {
    transform: scale(1) translateY(0);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  }
}

/* Enhanced enemy spawn with bounce */
@keyframes enemySpawnBounce {
  0% { 
    transform: translate(-50%, -50%) scale(0) rotate(180deg);
    opacity: 0;
  }
  40% {
    transform: translate(-50%, -50%) scale(1.3) rotate(0deg);
    opacity: 0.8;
  }
  60% {
    transform: translate(-50%, -50%) scale(0.9) rotate(0deg);
    opacity: 1;
  }
  80% {
    transform: translate(-50%, -50%) scale(1.1) rotate(0deg);
  }
  100% { 
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    opacity: 1;
  }
}

/* Mobile-optimized victory animation */
@keyframes victoryPulseMobile {
  0%, 100% {
    transform: scale(1);
    filter: brightness(1) saturate(1);
  }
  25% {
    transform: scale(1.1);
    filter: brightness(1.5) saturate(1.5);
  }
  50% {
    transform: scale(1.2);
    filter: brightness(2) saturate(2);
  }
  75% {
    transform: scale(1.1);
    filter: brightness(1.5) saturate(1.5);
  }
}

/* Floating damage preview animation for arcane blast targeting */
@keyframes floatingDamagePreview {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.9;
  }
  50% {
    transform: translate(-50%, -65%) scale(1.1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.9;
  }
}

/* Enhanced primary target damage preview */
@keyframes primaryTargetDamagePreview {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.9;
  }
  25% {
    transform: translate(-50%, -70%) scale(1.15);
    opacity: 1;
  }
  50% {
    transform: translate(-50%, -60%) scale(1.2);
    opacity: 1;
  }
  75% {
    transform: translate(-50%, -70%) scale(1.15);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.9;
  }
}

/* Apply enhanced animation to primary target */
.primary-target-damage {
  animation: primaryTargetDamagePreview 1.8s ease-in-out infinite !important;
}

/* Touch indicator animation */
@keyframes touchIndicator {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  50% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.5);
  }
} 