/* ============================================================
   public/Spellsanimations/Axe/axecleave.css
   Efeito da magia de arma "Deadly Cleave" (axe 50): o ÍCONE DA
   ARMA EQUIPADA dá UMA volta rápida em volta do caster girando
   no próprio eixo, em escala 90% ("diminuir 10%" — pedido do
   designer). Ataque AoE ao redor (8 tiles), NÃO direcional — o
   giro fica no CENTRO do personagem. Bem curto: o dano entra no
   cast (servidor aplica na hora), então a órbita tem que ser
   vistosa e rápida — machado rodando depois do dano sai feio.

   Integração: #melee-fx-layer + spawnAxeSpinFX() em game.js. O
   servidor (combat/index.js castWeaponSpell) manda x/y já como o
   CENTRO do tile do caster e o ícone da arma no payload.

   Pixel art cru: rotações em degraus (steps(1)) com valores
   inteiros, opacidade pode ter easing suave.
   ============================================================ */

.axecleave-fx {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    pointer-events: none;
    z-index: 40;
    image-rendering: pixelated;
}

/* Rotor: gira o ícone (filho, posicionado acima do centro) em
   volta do ponto de ancoragem. 1 volta RÁPIDA em 0.6s (mesma
   velocidade por volta do original de 2 voltas em 1.2s), em 12
   degraus de 30° (pixel art cru). */
.axecleave-fx__orbit {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    animation: axecleave-orbit 0.6s steps(12) 1 forwards;
}

/* Ícone da arma: fica 26px acima do centro e gira no próprio
   eixo 6x em 0.6s (0.1s/volta — 1.6x mais rápido que antes, em
   4 degraus, steps(4)), sincronizado com a órbita. Escala 0.9
   fixa durante o giro. */
.axecleave-fx__icon {
    position: absolute;
    left: -13px;
    top: -39px;
    width: 26px;
    height: 26px;
    object-fit: contain;
    image-rendering: pixelated;
    animation: axecleave-spin 0.1s steps(4) 6 forwards;
}

@keyframes axecleave-orbit {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@keyframes axecleave-spin {
    from { transform: scale(0.9) rotate(0deg); }
    to   { transform: scale(0.9) rotate(360deg); }
}