/* ==========================================================================
   SYSTEM ANIMACJI I EFEKTÓW WIZUALNYCH
   ========================================================================== */

/* --- KLASY ANIMACJI --- */

/* Efekt fizycznego lotu karty ze startu do celu */
.flying-card {
    position: fixed;
    z-index: 9999;
    width: 120px; 
    height: 170px;
    background: #fff;
    border: 2px solid var(--gold-dim);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2c3e50;
    font-weight: bold;
    text-align: center;
    padding: 10px;
    pointer-events: none; 
    transform-origin: center center;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.6s;
}

/* Animacja otrzymania obrażeń (potrząsanie i czerwona poświata) */
.anim-damage {
    animation: shake 0.4s cubic-bezier(.36,.07,.19,.97) both;
    box-shadow: 0 0 20px rgba(231, 76, 60, 0.8) !important;
    border-color: var(--red) !important;
}

/* Animacja leczenia (uniesienie i zielona poświata) */
.anim-heal {
    animation: floatUp 0.5s ease-out both;
    box-shadow: 0 0 20px rgba(46, 204, 113, 0.8) !important;
    border-color: var(--green) !important;
}

/* ==========================================================================
   KLATKI KLUCZOWE (KEYFRAMES)
   ========================================================================== */

/* Potrząsanie (Shake) */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-5px) rotate(-2deg); }
    40%, 80% { transform: translateX(5px) rotate(2deg); }
}

/* Unoszenie (Float Up) */
@keyframes floatUp {
    0% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0); }
}

/* Pulsowanie niebieskie (Targetowanie) */
@keyframes pulse-blue { 
    0% { box-shadow: 0 0 5px rgba(52, 152, 219, 0.4); } 
    50% { box-shadow: 0 0 20px rgba(52, 152, 219, 0.8); } 
    100% { box-shadow: 0 0 5px rgba(52, 152, 219, 0.4); } 
}

/* Pulsowanie złote (Akcje specjalne) */
@keyframes pulse-gold { 
    0% { box-shadow: 0 0 5px rgba(243, 156, 18, 0.4); } 
    50% { box-shadow: 0 0 20px rgba(243, 156, 18, 0.8); } 
    100% { box-shadow: 0 0 5px rgba(243, 156, 18, 0.4); } 
}

/* Pulsowanie stosu (Nowe zdarzenie) */
@keyframes stack-pulse { 
    0% { box-shadow: 0 0 0 rgba(142, 68, 173, 0); } 
    50% { box-shadow: 0 0 12px rgba(162, 155, 254, 0.6); } 
    100% { box-shadow: 0 0 0 rgba(142, 68, 173, 0); } 
}

/* Animacja obrotu (Flip) */
@keyframes sqFlipAnimation {
    0% { transform: scale(1.05) rotateY(90deg); opacity: 0.5; }
    100% { transform: scale(1) rotateY(0deg); opacity: 1; }
}
.sq-anim-flip {
    animation: sqFlipAnimation 0.4s ease-out forwards;
}