/* AURA DOS SUPORTES NA LUTA (25/10, opção C do autor; "mais Premium" depois das fotos) — src/ui/suporte-aura.js.
   A camada fica dentro do anchor do lutador (150x150, o do inimigo é espelhado; tudo aqui é simétrico).
   Cores: Mana #7fc8ff, Passo Leve #9be8c8, Lâminas #ffd76a, Reflexo #c99bff (as mesmas da placa do suporte). */
.pvp-fighter-anchor > .sup-aura{position:absolute;left:-12%;right:-12%;bottom:-6%;height:118%;pointer-events:none;z-index:6;
  --sup-rx:60px;--sup-ry:15px;--sup-c:#fff;--sup-c2:#fff;animation:supEntra .45s cubic-bezier(.2,1.4,.4,1) both}
.pvp-fighter-anchor > .sup-aura.sup-saindo{animation:supSai .4s ease-in both}
.pvp-fighter-anchor > .sup-aura.sup-mana{--sup-c:#7fc8ff;--sup-c2:#d9f0ff}
.pvp-fighter-anchor > .sup-aura.sup-passo{--sup-c:#9be8c8;--sup-c2:#eafff5}
.pvp-fighter-anchor > .sup-aura.sup-laminas{--sup-c:#ffd76a;--sup-c2:#fff6d0}
.pvp-fighter-anchor > .sup-aura.sup-reflexo{--sup-c:#c99bff;--sup-c2:#ff7ae0}
@keyframes supEntra{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@keyframes supSai{to{opacity:0;transform:scale(1.12)}}
.sup-aura i,.sup-aura span{position:absolute;display:block}

/* selo no chão: um disco que gira, achatado pela caixa de fora (perspectiva) */
.sup-chao{left:2%;right:2%;bottom:-2%;height:30%;transform:scaleY(.36);transform-origin:50% 100%}
.sup-chao i{left:50%;bottom:0;width:100%;aspect-ratio:1;max-width:100%;transform:translateX(-50%);border-radius:50%;
  background:repeating-conic-gradient(from 0deg,var(--sup-c) 0 4deg,transparent 4deg 15deg),radial-gradient(circle,transparent 52%,var(--sup-c) 53% 55%,transparent 56% 66%,var(--sup-c) 67% 68%,transparent 69%);
  -webkit-mask:radial-gradient(circle,transparent 54%,#000 55% 66%,transparent 67%),radial-gradient(circle,transparent 66%,#000 67% 70%,transparent 71%);
  mask:radial-gradient(circle,transparent 54%,#000 55% 66%,transparent 67%),radial-gradient(circle,transparent 66%,#000 67% 70%,transparent 71%);
  filter:drop-shadow(0 0 6px var(--sup-c));opacity:.9;animation:supGira 7s linear infinite}
.sup-chao::after{content:"";position:absolute;left:50%;bottom:0;width:100%;aspect-ratio:1;max-width:100%;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--sup-c) 45%,transparent),transparent 62%)}
@keyframes supGira{to{transform:translateX(-50%) rotate(360deg)}}

.sup-aura .sup-fundo.sup-estoura{animation:supEstoura .45s ease-out}
@keyframes supEstoura{40%{transform:scale(1.14);filter:brightness(1.9) saturate(1.3)}}
/* onda que sai do corpo no bloqueio / no dano devolvido */
.sup-onda{left:50%;top:52%;width:70%;aspect-ratio:1;max-width:100%;border-radius:50%;border:3px solid var(--sup-c2);
  box-shadow:0 0 16px var(--sup-c),inset 0 0 12px var(--sup-c);transform:translate(-50%,-50%) scale(.35);opacity:1;animation:supOnda .6s ease-out forwards}
@keyframes supOnda{to{transform:translate(-50%,-50%) scale(1.45);opacity:0;border-width:1px}}

/* partículas subindo */
.sup-faisca{left:var(--x);bottom:8%;width:5px;height:5px;border-radius:50%;background:var(--sup-c2);box-shadow:0 0 6px 1px var(--sup-c);
  opacity:0;animation:supSobe 1.8s ease-out infinite;animation-delay:var(--d)}
@keyframes supSobe{0%{opacity:0;transform:translateY(0) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translateY(-95px) scale(.2)}}

/* ESCUDO DE MANA: bolha de cristal, com brilho correndo a borda */
.sup-mana .sup-fundo{left:4%;right:4%;bottom:2%;aspect-ratio:1;max-width:100%;border-radius:50%;
  background:radial-gradient(circle at 33% 26%,rgba(255,255,255,.55),rgba(255,255,255,0) 18%),
    radial-gradient(circle,rgba(127,200,255,.05) 0 50%,rgba(127,200,255,.16) 62%,rgba(160,215,255,.5) 69%,transparent 71%),
    repeating-linear-gradient(60deg,rgba(200,235,255,.07) 0 2px,transparent 2px 14px),repeating-linear-gradient(-60deg,rgba(200,235,255,.07) 0 2px,transparent 2px 14px);
  -webkit-mask:radial-gradient(circle,#000 70%,transparent 71%);mask:radial-gradient(circle,#000 70%,transparent 71%);
  box-shadow:inset 0 0 22px rgba(127,200,255,.5);animation:supRespira 2.4s ease-in-out infinite}
.sup-mana .sup-borda{left:4%;right:4%;bottom:2%;aspect-ratio:1;max-width:100%;border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0 70%,rgba(217,240,255,.95) 82%,transparent 90%);
  -webkit-mask:radial-gradient(circle,transparent 66%,#000 67% 70%,transparent 71%);mask:radial-gradient(circle,transparent 66%,#000 67% 70%,transparent 71%);
  filter:drop-shadow(0 0 5px #7fc8ff);animation:supRoda 2.2s linear infinite}
@keyframes supRespira{50%{transform:scale(1.025)}}
@keyframes supRoda{to{transform:rotate(360deg)}}

/* PASSO LEVE: névoa verde, faixas de vento girando e o herói translúcido */
.sup-passo .sup-fundo{left:14%;right:14%;bottom:2%;top:18%;border-radius:45%;
  background:radial-gradient(ellipse at 50% 62%,rgba(155,232,200,.5),rgba(90,200,150,.18) 45%,transparent 72%);animation:supPisca 1.1s ease-in-out infinite}
.sup-vento{left:50%;top:calc(34% + var(--i) * 17%);width:96%;aspect-ratio:1;max-width:100%;margin-top:-48%;border-radius:50%;
  border:2px solid transparent;border-top-color:rgba(234,255,245,.95);border-right-color:rgba(155,232,200,.45);
  filter:drop-shadow(0 0 4px #9be8c8);animation:supVento calc(1s + var(--i) * .3s) linear infinite;animation-delay:calc(var(--i) * -.37s)}
@keyframes supVento{from{transform:translateX(-50%) scaleY(.26) rotate(0deg)}to{transform:translateX(-50%) scaleY(.26) rotate(360deg)}}
.pvp-fighter-anchor.sup-translucido > :not(.sup-aura):not(#pvpVisualizerEnemyFx){opacity:.6}
@keyframes supPisca{50%{opacity:.45}}
.sup-tempo{left:22%;right:22%;bottom:2%;height:6px;border-radius:3px;background:rgba(0,0,0,.6);overflow:hidden;box-shadow:0 0 0 1px rgba(155,232,200,.35)}
.sup-tempo i{position:relative;display:block;height:100%;background:linear-gradient(90deg,#4fc89a,#eafff5,#4fc89a);box-shadow:0 0 8px #9be8c8;transform-origin:50% 50%;transition:transform .25s linear}

/* ESCUDO DE LÂMINAS: selo dourado no chão e as lâminas com rastro */
.sup-laminas .sup-fundo{left:10%;right:10%;bottom:4%;top:20%;border-radius:45%;
  background:radial-gradient(ellipse at 50% 70%,rgba(255,215,106,.28),transparent 65%);animation:supPisca 1.6s ease-in-out infinite}

/* REFLEXO: casca de prisma roxa, selo sombrio, 6 espelhos girando */
.sup-reflexo .sup-fundo{left:9%;right:9%;bottom:1%;top:6%;border-radius:48% 48% 44% 44%;
  background:radial-gradient(ellipse at 50% 58%,rgba(40,10,60,.35),rgba(120,60,200,.18) 55%,rgba(201,155,255,.42) 70%,transparent 72%);
  -webkit-mask:radial-gradient(ellipse,#000 71%,transparent 72%);mask:radial-gradient(ellipse,#000 71%,transparent 72%);
  box-shadow:inset 0 0 26px rgba(201,155,255,.55);animation:supRespira 1.8s ease-in-out infinite}
.sup-reflexo .sup-borda{left:9%;right:9%;bottom:1%;top:6%;border-radius:48% 48% 44% 44%;
  background:conic-gradient(from 0deg,#c99bff,#ff7ae0,#7fd8ff,#c99bff,#ff7ae0,#7fd8ff,#c99bff);
  -webkit-mask:radial-gradient(ellipse,transparent 66%,#000 68% 71%,transparent 72%);mask:radial-gradient(ellipse,transparent 66%,#000 68% 71%,transparent 72%);
  filter:drop-shadow(0 0 6px #c99bff) saturate(1.2);opacity:.85;animation:supRoda 3.5s linear infinite}
.sup-reflexo .sup-chao i{animation-direction:reverse;animation-duration:5s}
.sup-orbita-cristal{bottom:56%!important}
.sup-cristal{width:9px;height:15px;margin:-7px -4px;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  background:linear-gradient(135deg,#fff 0,#ff7ae0 35%,#7f4cff 70%,#2a0f4a);filter:drop-shadow(0 0 5px #c99bff)}
.sup-reflexo .sup-onda{border-color:#ff7ae0;box-shadow:0 0 18px #c99bff,inset 0 0 14px #ff7ae0}

/* As cargas girando em volta do peito (elipse em 8 pontos; as de trás ficam mais apagadas) */
.sup-orbita{left:50%;bottom:46%;width:0;height:0}
.sup-orbita b{position:absolute;left:0;top:0;animation:supOrbita 3.2s linear infinite;animation-delay:calc(var(--i) / var(--n) * -3.2s);transition:opacity .3s}
.sup-orbita-cristal b{animation-duration:4.4s;animation-delay:calc(var(--i) / var(--n) * -4.4s)}
.sup-orbita b.sup-off{opacity:0!important;animation-play-state:paused}
.sup-orbe{width:14px;height:14px;margin:-7px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#7fc8ff 45%,#2a6aa8);
  box-shadow:0 0 10px #7fc8ff,0 0 3px 1px #fff,-8px 0 10px -2px rgba(127,200,255,.6)}
.sup-lamina{width:6px;height:22px;margin:-11px -3px;border-radius:3px 3px 1px 1px;background:linear-gradient(#fffbe8,#ffd76a 35%,#a07a1c);
  box-shadow:0 0 8px #ffd76a,0 6px 10px -2px rgba(255,215,106,.7)}
.sup-pena{width:8px;height:16px;margin:-8px -4px;border-radius:50% 50% 50% 50%/70% 70% 30% 30%;background:linear-gradient(#f4fffa,#9be8c8 50%,#3c9a78);
  box-shadow:0 0 8px #9be8c8,0 0 2px 1px #fff}
@keyframes supOrbita{
  0%{transform:translate(var(--sup-rx),0);opacity:1}
  12.5%{transform:translate(calc(var(--sup-rx)*.707),calc(var(--sup-ry)*.707));opacity:1}
  25%{transform:translate(0,var(--sup-ry));opacity:1}
  37.5%{transform:translate(calc(var(--sup-rx)*-.707),calc(var(--sup-ry)*.707));opacity:1}
  50%{transform:translate(calc(var(--sup-rx)*-1),0);opacity:.75}
  62.5%{transform:translate(calc(var(--sup-rx)*-.707),calc(var(--sup-ry)*-.707));opacity:.45}
  75%{transform:translate(0,calc(var(--sup-ry)*-1));opacity:.4}
  87.5%{transform:translate(calc(var(--sup-rx)*.707),calc(var(--sup-ry)*-.707));opacity:.45}
  100%{transform:translate(var(--sup-rx),0);opacity:1}
}
@media (max-width:600px){.pvp-fighter-anchor > .sup-aura{left:-2%;right:-2%;height:108%;--sup-rx:44px;--sup-ry:11px}}
@media (prefers-reduced-motion:reduce){
  .sup-aura,.sup-aura *,.sup-aura::after,.sup-aura *::after{animation:none!important}
  .sup-faisca,.sup-onda{display:none!important}
  .sup-orbita b{transform:translate(calc(var(--sup-rx) * (var(--i) / var(--n) * 2 - 1)),0)}
}
