.classe-fundo {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  border-radius: inherit;
}

.classe-fundo .base { position: absolute; inset: 0; z-index: 0; }

.classe-fundo .chao { position: absolute; left: 0; right: 0; bottom: 0; height: 42%; z-index: 1; }

.classe-fundo .mandala {
  position: absolute; left: 50%; top: 37%; transform: translate(-50%, -50%);
  z-index: 3;
}
.classe-fundo .aura-central {
  position: absolute; left: 50%; top: 37%; width: 100%; height: 88%;
  transform: translate(-50%, -50%); z-index: 4;
}
.classe-fundo .nucleo {
  position: absolute; left: 50%; top: 37%; width: 30%; height: 30%;
  transform: translate(-50%, -50%); z-index: 5; border-radius: 50%;
  mix-blend-mode: screen;
}
.classe-fundo .tema { position: absolute; z-index: 5; }
.classe-fundo .vinheta {
  position: absolute; inset: 0; z-index: 9; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 65% at 50% 37%, transparent 40%, rgba(0,0,0,.30) 72%, rgba(0,0,0,.72) 100%),
    linear-gradient(180deg, rgba(0,0,0,.35) 0%, transparent 16%, transparent 78%, rgba(0,0,0,.5) 100%);
}

@keyframes cf-girar { to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes cf-girar-inv { to { transform: translate(-50%, -50%) rotate(-360deg); } }
@keyframes cf-flutuar {
  0%, 100% { transform: translateY(0) rotate(var(--rot, 0deg)); }
  50% { transform: translateY(-16px) rotate(calc(var(--rot, 0deg) + 10deg)); }
}

/* ══════════════ GUERREIRO ══════════════ */
.classe-fundo--guerreiro .base {
  background: radial-gradient(ellipse 75% 70% at 50% 34%, #6B2417 0%, #3A1410 38%, #200B08 66%, #0A0403 100%);
}
.classe-fundo--guerreiro .chao {
  background: radial-gradient(ellipse 80% 100% at 50% 100%, rgba(255,122,58,.30) 0%, rgba(90,30,10,.18) 45%, transparent 75%);
}
.classe-fundo--guerreiro .aura-central {
  background: radial-gradient(circle, rgba(255,215,154,.55) 0%, rgba(255,122,58,.38) 30%, rgba(255,91,58,.20) 48%, rgba(255,91,58,.07) 64%, transparent 78%);
}
.classe-fundo--guerreiro .nucleo {
  background: radial-gradient(circle, #FFF3D6 0%, #FFB35C 45%, transparent 78%);
  opacity: .85;
}

/* ══════════════ ARQUEIRA ══════════════ */
.classe-fundo--arqueira .base {
  background: radial-gradient(ellipse 75% 70% at 50% 34%, #1F5236 0%, #12331F 38%, #0A2015 66%, #040E09 100%);
}
.classe-fundo--arqueira .chao {
  background: radial-gradient(ellipse 80% 100% at 50% 100%, rgba(180,255,122,.24) 0%, rgba(20,70,40,.18) 45%, transparent 75%);
}
.classe-fundo--arqueira .aura-central {
  background: radial-gradient(circle, rgba(232,255,194,.5) 0%, rgba(180,255,122,.34) 30%, rgba(76,227,111,.18) 48%, rgba(76,227,111,.06) 64%, transparent 78%);
}
.classe-fundo--arqueira .nucleo {
  background: radial-gradient(circle, #F3FFE0 0%, #B4FF7A 45%, transparent 78%);
  opacity: .8;
}

/* ══════════════ MAGA ══════════════ */
.classe-fundo--maga .base {
  background: radial-gradient(ellipse 75% 70% at 50% 34%, #35297A 0%, #1C1B4A 38%, #10112E 66%, #050614 100%);
}
.classe-fundo--maga .chao {
  background: radial-gradient(ellipse 80% 100% at 50% 100%, rgba(88,200,255,.24) 0%, rgba(40,20,90,.20) 45%, transparent 75%);
}
.classe-fundo--maga .aura-central {
  background: radial-gradient(circle, rgba(228,214,255,.55) 0%, rgba(200,137,255,.36) 30%, rgba(125,87,255,.20) 48%, rgba(88,200,255,.07) 64%, transparent 78%);
}
.classe-fundo--maga .nucleo {
  background: radial-gradient(circle, #F1E9FF 0%, #C889FF 45%, transparent 78%);
  opacity: .85;
}

@media (prefers-reduced-motion: reduce) {
  .classe-fundo .mandala,
  .classe-fundo .tema { animation: none !important; }
}