/* Mira das técnicas no celular (Claude) */
#mobile-skills [data-mobile-cast]{touch-action:none;transition:transform .08s}
#mobile-skills [data-mobile-cast] img{transform:translate(var(--kx,0),var(--ky,0));transition:transform .05s}
#mobile-skills [data-mobile-cast].aiming{box-shadow:0 0 0 3px #f7d77a,0 0 14px #f7d77a88;z-index:3}
#mobile-skills [data-mobile-cast].aiming.cancel{box-shadow:0 0 0 3px #e0283f,0 0 14px #e0283f88}
#mobile-skills [data-mobile-cast].denied{animation:aim-deny .25s}
#mobile-skills [data-mobile-cast].cooling img{filter:grayscale(.9) brightness(.55)}
#mobile-skills [data-mobile-cast] span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:18px Pix;color:#fff;text-shadow:1px 1px 0 #0c0812,-1px -1px 0 #0c0812;pointer-events:none}
.aim-ring{position:fixed;width:144px;height:144px;margin:-72px 0 0 -72px;border-radius:50%;border:2px dashed #f7d77a99;background:radial-gradient(circle,#f7d77a14 0,#f7d77a05 60%,transparent 70%);pointer-events:none;z-index:90;opacity:0;transform:scale(.6);transition:opacity .12s,transform .12s}
.aim-ring.on{opacity:1;transform:scale(1)}
@keyframes aim-deny{0%,100%{transform:translateX(0)}30%{transform:translateX(-4px)}70%{transform:translateX(4px)}}
/* ---- recarga das técnicas sem número (21/10): o ícone escurece ao usar e vai clareando de baixo para cima até 100% ----
   --cd vem de client/src/skill-aim.js > paintCooldown (1 = acabou de usar, 0 = pronta). Vale para a barra do PC e os botões do celular. */
html #skill-hotbar button>span[data-cooldown],html #mobile-skills [data-mobile-cast]>span{position:absolute;inset:0 0 auto 0;display:block;height:calc(var(--cd,0) * 100%);
  background:#0c0812b0;border-bottom:1px solid #f7d77a66;font-size:0;pointer-events:none;z-index:1}
html #skill-hotbar button:not(.cooling)>span[data-cooldown],html #mobile-skills [data-mobile-cast]:not(.cooling)>span{display:none}
html #skill-hotbar button.cooling img,html #mobile-skills [data-mobile-cast].cooling img{filter:grayscale(calc(var(--cd,0) * .9)) brightness(calc(1 - var(--cd,0) * .55))}
html #skill-hotbar button.cooling:disabled{opacity:1}
html #skill-hotbar button.cd-ready,html #mobile-skills [data-mobile-cast].cd-ready{animation:cd-ready .45s ease-out}
@keyframes cd-ready{0%{filter:brightness(1.9);box-shadow:0 0 0 2px #f7d77a,0 0 12px #f7d77a}100%{filter:none}}
@media (prefers-reduced-motion:reduce){html #skill-hotbar button.cd-ready,html #mobile-skills [data-mobile-cast].cd-ready{animation:none}}