/* ============================================================
   PVP-VISUAL.CSS — 11/10
   Sala de Batalha e Combate do PvP Online no mesmo visual dos seletores
   de Avatar / Arte de Batalha (pergaminho + azul-marinho + dourado).
   - Combate cabe numa tela: arena e técnicas à esquerda, histórico de
     turnos numa coluna alta à direita.
   - Técnicas em cartões compactos (arte, nome, dano e ícones de efeito).
   - Histórico maior, com arte do golpe, foto de quem joga e ícones.
   Só aparência: regras, cliques e polling continuam em pvp-online.js e
   pvp-arena.js. Carregado depois dos outros CSS do PvP.
   ============================================================ */
:root {
  --nrv-navy: #102b43; --nrv-navy2: #18324d; --nrv-navy3: #0f2338;
  --nrv-gold: #c5a15a; --nrv-gold2: #b58a44; --nrv-goldtxt: #ffe7a3;
  --nrv-parch: #fff7e7; --nrv-parch2: #eadbbc; --nrv-ink: #183553;
  --nrv-azul: #5fb2ff; --nrv-verm: #ff6b66;
}

/* ── Caixa do modal: moldura de pergaminho (como os seletores) ─────── */
#pvponArenaBox:has(.nr-room-body), #pvponArenaBox:has(.nr-battle-body) {
  background: linear-gradient(90deg, #d9c18d66, transparent 4%, transparent 96%, #d9c18d66), linear-gradient(160deg, var(--nrv-parch), var(--nrv-parch2));
  border: 1px solid #aa8447; border-top: 5px solid var(--nrv-gold2); border-radius: 4px;
  box-shadow: inset 0 0 0 3px #f6e6bc, 0 22px 70px rgba(0,0,0,.7);
  padding: 0 6px 6px;
}
#pvponArenaBox:has(.nr-room-body) > .pvpon-modal-header, #pvponArenaBox:has(.nr-battle-body) > .pvpon-modal-header {
  position: relative; justify-content: center; background: transparent; border: 0;
  min-height: 0; padding: 6px 54px 6px;
}
#pvponArenaBox:has(.nr-room-body) #pvponArenaTitulo, #pvponArenaBox:has(.nr-battle-body) #pvponArenaTitulo {
  display: inline-block; padding: 4px 34px;
  font: 800 13px/1.2 Georgia, "Times New Roman", serif; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--nrv-goldtxt); -webkit-text-fill-color: var(--nrv-goldtxt);
  background: linear-gradient(110deg, var(--nrv-navy), #294e69, var(--nrv-navy));
  border: 2px solid var(--nrv-gold); box-shadow: inset 0 0 0 2px #142e46;
  clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
  text-shadow: 0 2px 2px #000a;
}
#pvponArenaBox:has(.nr-room-body) #pvponArenaFechar, #pvponArenaBox:has(.nr-battle-body) #pvponArenaFechar {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; padding: 0; border-radius: 50%;
  background: linear-gradient(#1d3b57, var(--nrv-navy)); border: 2px solid var(--nrv-gold);
  color: var(--nrv-goldtxt); font-size: 16px; font-weight: 700; line-height: 1; cursor: pointer;
}
#pvponArenaBox:has(.nr-room-body) #pvponArenaFechar:empty::before, #pvponArenaBox:has(.nr-battle-body) #pvponArenaFechar:empty::before { content: "\2715"; }
#pvponSalaModal.nr-room-body, #pvponSalaModal.nr-battle-body {
  border: 1px solid #8a6a30; border-radius: 3px; box-shadow: 0 0 0 1px #f6e6bc;
}

/* ============================================================
   SALA DE BATALHA
   ============================================================ */
#pvponSalaModal .nr-room { padding: 10px 16px 0; }
#pvponSalaModal .nr-room-heading { padding-bottom: 10px; }
#pvponSalaModal .nr-room-heading h1 {
  display: inline-block; margin: 2px 0 0; padding: 6px 48px;
  font: 800 26px/1.15 Georgia, "Times New Roman", serif; letter-spacing: 4px; text-transform: uppercase;
  color: var(--nrv-goldtxt);
  background: linear-gradient(110deg, var(--nrv-navy), #294e69, var(--nrv-navy));
  border: 2px solid var(--nrv-gold); outline: 1px solid #273d49; outline-offset: 3px;
  box-shadow: 0 6px 14px #0008, inset 0 0 0 3px #142e46;
  clip-path: polygon(4% 0, 96% 0, 100% 50%, 96% 100%, 4% 100%, 0 50%);
}
#pvponSalaModal .nr-room-heading p { margin: 6px; font-size: 13px; }
#pvponSalaModal .nr-room-team h2 {
  width: fit-content; margin: 0 auto 8px; padding: 5px 40px;
  font: 800 18px/1.2 Georgia, "Times New Roman", serif; letter-spacing: 3px;
  color: var(--team); border: 2px solid var(--team); border-top-width: 2px;
  background: linear-gradient(110deg, #0b1f33, #1d3a55, #0b1f33);
  clip-path: polygon(6% 0, 94% 0, 100% 50%, 94% 100%, 6% 100%, 0 50%);
  text-shadow: 0 2px 3px #000;
}
#pvponSalaModal .nr-room-player {
  border: 2px solid var(--nrv-gold); border-radius: 3px;
  background: radial-gradient(circle at 50% 35%, rgba(var(--team-rgb),.55), #081728dd 75%);
  box-shadow: 0 8px 20px #0008, inset 0 0 0 2px rgba(var(--team-rgb),.9), inset 0 0 24px rgba(var(--team-rgb),.45);
  transition: transform .15s, box-shadow .15s;
}
#pvponSalaModal .nr-room-player:not(.empty):hover { transform: translateY(-2px); box-shadow: 0 10px 24px #000a, inset 0 0 0 2px var(--team), inset 0 0 30px rgba(var(--team-rgb),.6); }
#pvponSalaModal .nr-room-player.empty { border-style: dashed; border-color: #c5a15a99; }
#pvponSalaModal .nr-room-art { height: clamp(150px, 25vh, 330px); }
#pvponSalaModal .nr-mode-1 .nr-room-art { height: clamp(190px, 30vh, 360px); }
#pvponSalaModal .nr-room-name {
  position: relative; border-top: 2px solid #9fb0c2; padding: 6px 6px 5px;
  background: linear-gradient(90deg, #1c2633 0%, #2a3442 55%, #3a4352 100%);
}
#pvponSalaModal .nr-room-name strong { font: 700 15px/1.2 Georgia, "Times New Roman", serif; color: #fff; text-shadow: 0 2px 3px #000; }
#pvponSalaModal .nr-room-name small { color: #d8c79c; font-weight: 700; letter-spacing: .5px; }
#pvponSalaModal .nr-room-ready { background: var(--nrv-navy3); color: var(--nrv-goldtxt); letter-spacing: 1px; border-top: 1px solid var(--nrv-gold2); }
#pvponSalaModal .nr-room-ready.ready { color: #0d2a12; background: linear-gradient(#a8ec86, #5fbf4c); }
#pvponSalaModal .nr-vs { font: 900 44px Georgia, serif; color: var(--nrv-goldtxt); -webkit-text-stroke: 1px #6b4a17; text-shadow: 0 0 18px #ffad48, 0 3px 4px #000; }

/* Faixa de baixo: painéis azuis com título em faixa dourada */
#pvponSalaModal .nr-room-bottom {
  margin: 12px -16px 0; padding: 10px 12px; gap: 10px;
  background: linear-gradient(180deg, #0f2338f2, #0b1a2bf7); border-top: 3px solid var(--nrv-gold2);
}
#pvponSalaModal .nr-room-bottom section {
  border: 1px solid var(--nrv-gold); border-radius: 3px; padding: 8px 10px;
  background: linear-gradient(180deg, var(--nrv-navy3), var(--nrv-navy2)); box-shadow: inset 0 0 0 1px #28455f;
}
#pvponSalaModal .nr-room-bottom h3 {
  display: inline-block; margin: 0 0 7px; padding: 2px 16px;
  font: 800 11px/1.4 Georgia, serif; letter-spacing: 2px; text-transform: uppercase;
  color: var(--nrv-ink); background: linear-gradient(var(--nrv-goldtxt), #d9b46a);
  clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 50%, calc(100% - 6px) 100%, 6px 100%, 0 50%);
}
#pvponSalaModal .nr-room-bottom h3 span { color: #5a3d0f; }
#pvponSalaModal .nr-room-bottom button {
  background: linear-gradient(#1d3b57, var(--nrv-navy)); border: 1px solid var(--nrv-gold);
  color: var(--nrv-goldtxt); border-radius: 3px;
}
#pvponSalaModal .nr-room-bottom button:hover:not(:disabled) { filter: brightness(1.25); }
#pvponSalaModal .nr-room-actions .pvpon-btn-iniciar {
  font: 900 20px/1 Georgia, serif !important; letter-spacing: 2px; padding: 12px !important;
  background: linear-gradient(#ffe08a, #d39a35) !important; color: #2a1806 !important;
  border: 2px solid #fff0b8 !important; box-shadow: 0 0 0 2px var(--nrv-gold2), 0 6px 16px #0008;
}
#pvponSalaModal .nr-room-actions .pvpon-btn-iniciar[style*="#2ecc71"] { background: linear-gradient(#a8ec86, #4caf3f) !important; color: #0d2a12 !important; }
#pvponSalaModal .nr-room-actions .pvpon-btn-iniciar[style*="#e74c3c"] { background: linear-gradient(#ff8b7f, #c0392b) !important; color: #2a0705 !important; }
#pvponSalaModal .nr-room-actions .pvpon-btn-iniciar:disabled { filter: grayscale(.55) brightness(.85); }
#pvponSalaModal #nrRoomDeck { margin: 6px 0 8px; }
#pvponSalaModal #nrRoomDeck span { height: 42px; border: 1px solid var(--nrv-gold); border-radius: 3px; }
#pvponSalaModal .nr-room-chat .pvpon-chat-msgs { height: 64px; }

/* ============================================================
   COMBATE
   ============================================================ */
#pvponSalaModal.nr-battle-body { background: #0a1929; }
#pvponSalaModal.nr-battle-body .pon-combate { gap: 0; overflow: hidden; }
/* Topo: ronda/turno · ordem dos turnos · relógio · abandonar */
#pvponSalaModal.nr-battle-body .pon-combate-topo {
  flex-wrap: nowrap; gap: 12px; padding: 6px 12px; min-height: 52px;
  background: linear-gradient(110deg, var(--nrv-navy), #1f4262 50%, var(--nrv-navy));
  border-bottom: 2px solid var(--nrv-gold);
}
#pvponSalaModal.nr-battle-body .pon-combate-topo-titulo { flex: 0 1 auto; min-width: 150px; }
#pvponSalaModal.nr-battle-body .pon-combate-titulo-linha1 { font: 800 16px/1.2 Georgia, serif; color: var(--nrv-goldtxt); letter-spacing: 1px; }
#pvponSalaModal.nr-battle-body .pon-combate-titulo-linha2 { font-size: 12px; }
.nr-bt-turnos { flex: 1; display: flex; justify-content: center; min-width: 0; }
.nr-bt-turnos .nr-turn-order {
  position: static; transform: none; display: flex; align-items: center; gap: 5px;
  padding: 3px 8px; max-width: 100%; overflow-x: auto;
  background: #08182acc; border: 1px solid var(--nrv-gold); border-radius: 3px;
}
.nr-bt-turnos .nr-turn-order > span {
  position: static; width: auto; margin-right: 3px;
  font: 800 9px/1.1 Georgia, serif; letter-spacing: 1px; color: var(--nrv-goldtxt); max-width: 52px; white-space: normal;
}
.nr-bt-turnos .nr-turn-order > div { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; border: 2px solid #7d8a98; }
.nr-bt-turnos .nr-turn-order > div.active { border-color: #ffdd77; box-shadow: 0 0 10px #ffcf65; transform: scale(1.12); }
#pvponSalaModal.nr-battle-body .nr-turn-clock {
  font: 800 22px/1 Georgia, serif; color: var(--nrv-goldtxt); padding: 6px 12px;
  background: #08182a; border: 2px solid var(--nrv-gold); border-radius: 3px;
}
#pvponSalaModal.nr-battle-body .nr-turn-clock.urgent { color: #ff9c83; border-color: #ff7b66; box-shadow: 0 0 10px #ff6a5577; }
#pvponSalaModal.nr-battle-body .pon-btn-abandonar {
  background: linear-gradient(#5a1d1d, #3a1010); color: #ffc9bc; border: 1px solid #c86a5a; border-radius: 3px;
  padding: 7px 12px; font-weight: 800; cursor: pointer;
}

/* Corpo: arena + técnicas à esquerda, histórico à direita */
.nr-bt-main { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) clamp(270px, 24vw, 380px); gap: 8px; padding: 8px; }
.nr-bt-esq { display: flex; flex-direction: column; gap: 8px; min-width: 0; min-height: 0; }
#pvponSalaModal.nr-battle-body .pon-arena-3col { flex: 1 1 auto; min-height: 250px; display: block; position: relative; }
#pvponSalaModal.nr-battle-body .pon-arena-quadro {
  position: absolute; inset: 0; width: auto; height: auto; min-height: 0; max-height: none; aspect-ratio: auto;
  border: 2px solid var(--nrv-gold); border-radius: 3px;
  box-shadow: inset 0 0 0 1px #0008, 0 4px 14px #0007;
}
#pvponSalaModal.nr-battle-body .pon-standees-arena { inset: 6px 12px 8px; }
#pvponSalaModal.nr-battle-body .pon-standee-img-wrap { height: clamp(100px, 23vh, 290px); }
#pvponSalaModal.nr-battle-body[data-mode="1"] .pon-standee-img-wrap { height: clamp(150px, 33vh, 400px); }

/* Placa do lutador: faixa escura com canto cortado (como no seletor) */
#pvponSalaModal .nr-fighter-plate {
  border: 2px solid var(--team); border-radius: 0; padding: 5px 8px 6px;
  background: linear-gradient(90deg, #1c2633f2 0%, #2a3442f2 55%, #3a4352f2 100%);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}
#pvponSalaModal.nr-battle-body .pon-standee-nome { font: 700 13px/1.25 Georgia, "Times New Roman", serif; color: #fff; }
#pvponSalaModal.nr-battle-body .pon-standee-nome small { font: 800 10px Nunito, sans-serif; color: var(--nrv-goldtxt); }
#pvponSalaModal.nr-battle-body .pon-hp-bar-wrap { height: 8px; border: 1px solid #0009; border-radius: 2px; overflow: hidden; }
#pvponSalaModal.nr-battle-body .pon-standee.turno-ativo .nr-fighter-plate { box-shadow: 0 0 14px #ffd76699; }
#pvponSalaModal.nr-battle-body .nr-turn-label { color: var(--nrv-goldtxt); font: 900 12px Georgia, serif; letter-spacing: 1px; }
/* Escolher alvo: o alvo possível fica vermelho e a pulsar, como o "escolhido" do seletor */
#pvponSalaModal.nr-battle-body .pon-standee.alvo-clicavel .nr-fighter-plate { animation: nrvAlvo 1.1s ease-in-out infinite; }
#pvponSalaModal.nr-battle-body .pon-standee.alvo-clicavel:hover .nr-fighter-plate,
#pvponSalaModal.nr-battle-body .pon-standee.alvo-clicavel:focus-visible .nr-fighter-plate {
  outline: 0; border-color: #fff; background: linear-gradient(90deg, #7d1414, #b3262b 60%, #d6453c);
  box-shadow: 0 0 16px #ff4b3e;
}
#pvponSalaModal.nr-battle-body .pon-standee.alvo-clicavel:hover .pon-standee-img { filter: drop-shadow(0 0 10px #ff5b4d) brightness(1.1); }
@keyframes nrvAlvo { 0%,100% { box-shadow: 0 0 0 #ff4b3e00; } 50% { box-shadow: 0 0 14px #ff4b3e; } }

/* ── Painel das técnicas ─────────────────────────────────── */
#pvponSalaModal.nr-battle-body .pon-combate-baixo { display: block; flex: 0 0 auto; margin: 0; padding: 0; border: 0; background: none; }
#pvponSalaModal.nr-battle-body .pon-combate-baixo-acoes {
  border: 1px solid var(--nrv-gold); border-radius: 3px;
  background: linear-gradient(180deg, var(--nrv-navy3), var(--nrv-navy2)); box-shadow: inset 0 0 0 1px #28455f;
}
#pvponSalaModal.nr-battle-body .pon-acoes { padding: 7px 8px 8px; }
.nr-bt-acoes-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; flex-wrap: wrap; }
#pvponSalaModal.nr-battle-body .nr-bt-acoes-topo .pon-acoes-titulo {
  margin: 0; padding: 2px 18px; font: 800 12px/1.5 Georgia, serif; letter-spacing: 2px; text-transform: uppercase;
  color: var(--nrv-ink); background: linear-gradient(var(--nrv-goldtxt), #d9b46a);
  clip-path: polygon(7px 0, calc(100% - 7px) 0, 100% 50%, calc(100% - 7px) 100%, 7px 100%, 0 50%);
}
.nr-bt-basicas { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
#pvponSalaModal.nr-battle-body .nr-bt-basicas .pon-btn { min-height: 34px; padding: 5px 14px; border-radius: 3px; font-weight: 800; }
#pvponSalaModal.nr-battle-body .nr-bt-basicas .pon-btn-ataque { background: linear-gradient(#ffe08a, #d39a35); color: #2a1806; border: 1px solid #fff0b8; }
#pvponSalaModal.nr-battle-body .nr-bt-basicas .nr-pass { background: linear-gradient(#1d3b57, var(--nrv-navy)); color: var(--nrv-goldtxt); border: 1px solid var(--nrv-gold); }
#pvponSalaModal.nr-battle-body .pon-acoes-btns { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 6px; }

/* Cartão da técnica */
#pvponSalaModal.nr-battle-body .pon-btn-jutsu {
  position: relative; display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 7px;
  min-height: 0; height: 54px; padding: 4px 8px 4px 4px; text-align: left; overflow: hidden;
  background: linear-gradient(90deg, #1c2633 0%, #22344a 60%, #2c4560 100%);
  border: 1px solid #9fb0c2aa; border-radius: 0; color: #fff;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  transition: transform .12s, filter .12s, border-color .12s;
}
#pvponSalaModal.nr-battle-body .pon-btn-jutsu:not(:disabled):hover { border-color: var(--nrv-goldtxt); filter: brightness(1.18); transform: translateY(-1px); }
#pvponSalaModal.nr-battle-body .pon-btn-jutsu:not(:disabled):active { transform: translateY(1px); }
.nr-jt-arte { position: relative; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid var(--nrv-gold); background: #0b1826; overflow: hidden; display: flex; align-items: center; justify-content: center; }
#pvponSalaModal.nr-battle-body .nr-jt-arte .pon-jutsu-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nr-jt-arte .pon-jutsu-emoji { font-size: 22px; }
.nr-jt-info { display: flex; flex-direction: column; justify-content: center; gap: 2px; min-width: 0; flex: 1; }
.nr-jt-nome { font: 700 12px/1.2 Georgia, "Times New Roman", serif; color: #fff; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.nr-jt-meta { display: flex; align-items: center; gap: 5px; min-width: 0; white-space: nowrap; overflow: hidden; font-size: 11px; }
#pvponSalaModal.nr-battle-body .nr-jt-meta .pon-jutsu-dano { color: #9ff07a; font-weight: 900; font-family: Nunito, sans-serif; }
#pvponSalaModal.nr-battle-body .nr-jt-meta .pon-jutsu-suporte { color: #9fd4ff; font-weight: 800; text-transform: uppercase; font-size: 10px; letter-spacing: .5px; }
.nr-jt-meta .pvpf-icones { font-size: 12px; letter-spacing: 1px; overflow: hidden; text-overflow: clip; }
.nr-jt-recarga { color: #c9b98f; font-style: italic; }
#pvponSalaModal.nr-battle-body .pon-jutsu-cd { opacity: 1; filter: none; cursor: not-allowed; }
#pvponSalaModal.nr-battle-body .pon-jutsu-cd .nr-jt-arte img, #pvponSalaModal.nr-battle-body .pon-jutsu-cd .nr-jt-nome { filter: grayscale(1) brightness(.6); }
#pvponSalaModal.nr-battle-body .pon-jutsu-cd .pon-jutsu-cd-badge {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: #000a; color: #ffe7a3; font: 900 13px Nunito, sans-serif; border: 0; margin: 0; padding: 0;
}

/* Escolher alvo / aguardar / fim */
#pvponSalaModal.nr-battle-body .pon-acoes > .pon-btn-danger { min-height: 34px; padding: 5px 16px; }
#pvponSalaModal.nr-battle-body .pon-aguardando { display: flex; align-items: center; gap: 12px; padding: 12px 14px; font: 700 15px Georgia, serif; color: var(--nrv-goldtxt); }
.nr-bt-aguarda-foto { flex: 0 0 46px; width: 46px; height: 46px; border-radius: 50%; overflow: hidden; border: 2px solid var(--nrv-azul); background: #0b1826; animation: nrvEspera 1.6s ease-in-out infinite; }
.nr-bt-aguarda-foto.lado-b { border-color: var(--nrv-verm); }
.nr-bt-aguarda-foto img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
@keyframes nrvEspera { 50% { box-shadow: 0 0 14px #ffe7a399; } }

/* ── Histórico de turnos: pergaminho numa coluna alta ───────── */
.nr-bt-log {
  display: flex; flex-direction: column; min-height: 0; min-width: 0;
  background: linear-gradient(90deg, #d9c18d55, transparent 6%, transparent 94%, #d9c18d55), linear-gradient(160deg, var(--nrv-parch), var(--nrv-parch2)) !important;
  border: 1px solid #aa8447 !important; border-top: 4px solid var(--nrv-gold2) !important; border-radius: 3px !important;
  box-shadow: inset 0 0 0 3px #f6e6bc;
}
#pvponSalaModal .nr-bt-log .pon-log-titulo {
  align-self: center; margin: 7px 0 5px; padding: 3px 22px;
  font: 800 12px/1.4 Georgia, serif; letter-spacing: 2px; text-transform: uppercase;
  color: var(--nrv-goldtxt); background: linear-gradient(110deg, var(--nrv-navy), #294e69, var(--nrv-navy));
  border: 2px solid var(--nrv-gold); clip-path: polygon(6% 0, 94% 0, 100% 50%, 94% 100%, 6% 100%, 0 50%);
}
#pvponSalaModal .nr-bt-log .pon-log {
  flex: 1; height: auto; max-height: none; min-height: 0; overflow-y: auto;
  display: block; padding: 0 8px 8px; margin: 0; background: none; border: 0; border-radius: 0;
  scrollbar-width: thin; scrollbar-color: var(--nrv-gold2) transparent;
}
#pvponSalaModal .nr-bt-log .pon-log-line {
  display: flex; align-items: center; gap: 8px; margin: 0; padding: 5px 4px;
  font: 600 12.5px/1.35 Nunito, system-ui, sans-serif; color: #2b2416;
  background: none; border: 0; border-bottom: 1px dashed #b6975a66; border-radius: 0;
}
#pvponSalaModal .nr-bt-log .pon-log-txt { min-width: 0; overflow-wrap: anywhere; }
.pon-log-num { color: var(--nrv-ink); font-weight: 900; }
.pon-log-nome { font-weight: 900; }
.pon-log-nome.lado-a { color: #1d5fa6; }
.pon-log-nome.lado-b { color: #b02a2a; }
/* Golpe: arte + cara de quem usou */
.pon-log-golpe { position: relative; flex: 0 0 38px; width: 38px; height: 38px; border: 1px solid var(--nrv-gold2); background: #102b43; display: flex; align-items: center; justify-content: center; }
.pon-log-golpe > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pon-log-golpe > img + i { display: none; }
.pon-log-golpe > i { font-style: normal; font-size: 19px; line-height: 1; }
.pon-log-quem { position: absolute; right: -6px; bottom: -6px; width: 20px; height: 20px; border-radius: 50%; overflow: hidden; border: 2px solid var(--nrv-azul); background: #0b1826; }
.pon-log-quem.lado-b { border-color: var(--nrv-verm); }
.pon-log-quem img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.pon-log-quem.sem-foto { display: none; }
/* Ícone redondo por tipo de linha */
.pon-log-ic { flex: 0 0 26px; width: 26px; height: 26px; margin: 0 6px 0 6px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; line-height: 1; background: #e3d5b3; border: 1px solid #b6975a; }
.pon-log-dano .pon-log-ic { background: #f6d2c8; border-color: #c0573f; }
.pon-log-cura .pon-log-ic { background: #d4efc9; border-color: #4f9a3d; }
.pon-log-defesa .pon-log-ic { background: #d3e3f5; border-color: #3f6ea8; }
.pon-log-controle .pon-log-ic { background: #e4d6f3; border-color: #7a4fae; }
.pon-log-critico .pon-log-ic { background: #3a2b2b; border-color: #000; }
.pon-log-vitoria .pon-log-ic { background: #ffe39a; border-color: #b58a44; }
#pvponSalaModal .nr-bt-log .pon-log-critico { color: #7c1d1d; font-weight: 800; }
#pvponSalaModal .nr-bt-log .pon-log-vitoria { color: #6b4a00; font-weight: 900; background: #ffe7a355; }
#pvponSalaModal .nr-bt-log .pon-log-ataque { font-weight: 700; }
/* Cabeçalho "Turno de X" */
#pvponSalaModal .nr-bt-log .pon-log-line.pon-log-turno {
  margin-top: 6px; padding: 4px 8px; border: 0; color: #fff; font: 700 12.5px Georgia, serif;
  background: linear-gradient(90deg, #1c2633, #2a3442 60%, #3a435200);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
#pvponSalaModal .nr-bt-log .pon-log-turno .pon-log-nome.lado-a { color: #8cc7ff; }
#pvponSalaModal .nr-bt-log .pon-log-turno .pon-log-nome.lado-b { color: #ff9d97; }
.pon-log-foto { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; overflow: hidden; border: 2px solid var(--nrv-azul); background: #0b1826; }
.pon-log-foto.lado-b { border-color: var(--nrv-verm); }
.pon-log-foto img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
/* Divisor de ronda */
.pon-log-ronda { display: flex; align-items: center; gap: 8px; margin: 8px 0 2px; font: 800 11px Georgia, serif; letter-spacing: 2px; text-transform: uppercase; color: #7a5a22; }
.pon-log-ronda::before, .pon-log-ronda::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, #b58a44, transparent); }

/* ── Celular / tela estreita: tudo em coluna, histórico por baixo ── */
@media (max-width: 900px) {
  .nr-bt-main { display: flex; flex-direction: column; overflow-y: auto; }
  .nr-bt-esq, .nr-bt-esq > *, .nr-bt-log { flex-shrink: 0; }
  #pvponSalaModal.nr-battle-body .pon-combate-topo { flex-wrap: wrap; }
  .nr-bt-turnos { order: 3; flex-basis: 100%; }
  #pvponSalaModal.nr-battle-body .pon-arena-3col { flex: none; }
  #pvponSalaModal.nr-battle-body .pon-arena-quadro { position: relative; inset: auto; width: 100%; height: clamp(300px, 52vh, 460px); }
  .nr-bt-log { flex: none; height: 300px; }
  #pvponSalaModal.nr-battle-body .pon-acoes-btns { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); max-height: none; overflow: visible; }
  #pvponSalaModal .nr-room-heading h1 { font-size: 20px; padding: 5px 30px; letter-spacing: 2px; }
  #pvponSalaModal .nr-room-team h2 { font-size: 14px; padding: 4px 18px; letter-spacing: 1px; }
}
@media (max-width: 480px) {
  #pvponSalaModal.nr-battle-body .pon-arena-quadro { height: 650px; }
  #pvponSalaModal.nr-battle-body[data-mode="1"] .pon-arena-quadro { height: 420px; }
  #pvponSalaModal.nr-battle-body[data-mode="2"] .pon-arena-quadro { height: 520px; }
  #pvponSalaModal.nr-battle-body .pon-standee-img-wrap { height: 100px; }
  #pvponSalaModal.nr-battle-body[data-mode="1"] .pon-standee-img-wrap { height: 210px; }
  #pvponSalaModal.nr-battle-body .pon-acoes-btns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #pvponSalaModal.nr-battle-body .pon-btn-jutsu { flex-direction: row; text-align: left; }
  #pvponSalaModal.nr-battle-body .pon-combate-topo-titulo { min-width: 0; }
  #pvponArenaBox:has(.nr-room-body), #pvponArenaBox:has(.nr-battle-body) { padding: 0 3px 3px; }
}

/* A caixa do combate ocupa a altura da tela e o corpo deixa de rolar:
   quem rola, se for preciso, é só o histórico (e a coluna, no celular). */
#pvponArenaBox:has(.nr-battle-body) { height: 96svh; }
#pvponSalaModal.nr-battle-body { display: flex; flex-direction: column; overflow: hidden; flex: 1 1 auto; min-height: 0; }
#pvponSalaModal.nr-battle-body .pon-combate-content { flex: 1; min-height: 0; }
#pvponSalaModal.nr-battle-body .pon-combate { flex: 1; min-height: 0; display: flex; flex-direction: column; }

/* Sala no celular: os dois times um por cima do outro (lado a lado, com
   3 jogadores cada, os cartões ficavam finos demais para ler o nome). */
@media (max-width: 600px) {
  #pvponSalaModal .nr-room .nr-room-teams { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  #pvponSalaModal .nr-room.nr-mode-1 .nr-room-team, #pvponSalaModal .nr-room.nr-mode-1 .nr-room-team.red { width: min(260px, 100%); justify-self: center; }
  #pvponSalaModal .nr-vs { font-size: 28px; line-height: 1; }
  #pvponSalaModal .nr-room-art { height: 140px; }
  #pvponSalaModal .nr-mode-1 .nr-room-art { height: 170px; }
  #pvponSalaModal .nr-room-name strong { font-size: 13px; }
  #pvponSalaModal .nr-room-name small, #pvponSalaModal .nr-room-ready { font-size: 10px; }
  #pvponArenaBox:has(.nr-room-body) #pvponArenaTitulo, #pvponArenaBox:has(.nr-battle-body) #pvponArenaTitulo { font-size: 11px; letter-spacing: 1.5px; padding: 4px 22px; }
  #pvponSalaModal .nr-room-heading h1 { font-size: 18px; padding: 5px 24px; }
}

/* Estados do painel de ações: a escolher alvo / à espera do outro */
#pvponSalaModal.nr-battle-body .pon-aguardando { background: none; border: 0; clip-path: none; box-shadow: none; }
#pvponSalaModal.nr-battle-body .pon-aguardando::before { display: none; }
#pvponSalaModal.nr-battle-body .pon-acoes { flex-direction: column; align-items: stretch; }
#pvponSalaModal.nr-battle-body .pon-acoes > .pon-acoes-titulo { margin: 4px 0 8px; font: 800 15px Georgia, serif; }
#pvponSalaModal.nr-battle-body .pon-acoes > .pon-btn-danger,
#pvponSalaModal.nr-battle-body .pon-acoes > .pon-acoes-btns > .pon-btn-ataque:only-child {
  align-self: flex-start; width: auto; min-height: 34px; padding: 5px 18px; border-radius: 3px; font-weight: 800;
}
#pvponSalaModal.nr-battle-body .pon-acoes > .pon-btn-danger { background: linear-gradient(#a8322a, #6e1b16); color: #ffe1da; border: 1px solid #ff9c8a; }
#pvponSalaModal.nr-battle-body .pon-resultado { background: none; border: 0; clip-path: none; padding: 14px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; color: var(--nrv-goldtxt); }
#pvponSalaModal.nr-battle-body .pon-resultado::before { display: none; }

/* ── Histórico: foto redonda de quem é o assunto da linha (11/10) ── */
.pon-log-sujeito { position: relative; flex: 0 0 34px; width: 34px; height: 34px; margin: 0 4px 0 2px; }
.pon-log-sujeito-foto { display: block; width: 34px; height: 34px; border-radius: 50%; overflow: hidden; border: 2px solid var(--nrv-azul); background: #0b1826; box-shadow: 0 1px 3px #0005; }
.pon-log-sujeito-foto.lado-b { border-color: var(--nrv-verm); }
.pon-log-sujeito-foto img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.pon-log-sujeito > i {
  position: absolute; right: -5px; bottom: -4px; width: 18px; height: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font: normal 10px/1 sans-serif;
  background: #e3d5b3; border: 1px solid #b6975a;
}
.pon-log-dano .pon-log-sujeito > i { background: #f6d2c8; border-color: #c0573f; }
.pon-log-cura .pon-log-sujeito > i { background: #d4efc9; border-color: #4f9a3d; }
.pon-log-defesa .pon-log-sujeito > i { background: #d3e3f5; border-color: #3f6ea8; }
.pon-log-controle .pon-log-sujeito > i { background: #e4d6f3; border-color: #7a4fae; }
.pon-log-critico .pon-log-sujeito > i { background: #3a2b2b; border-color: #000; }
.pon-log-critico .pon-log-sujeito-foto { filter: grayscale(1); }
.pon-log-vitoria .pon-log-sujeito > i { background: #ffe39a; border-color: #b58a44; }

/* ============================================================
   POPUP DO FIM DA PARTIDA (11/10) — pergaminho, faixa e placar
   ============================================================ */
.pon-result-overlay { background: radial-gradient(circle at 50% 30%, rgba(16,43,67,.72), rgba(4,10,20,.9)); backdrop-filter: blur(3px); }
.pon-result-card.nrv-res {
  --notch: 0px; clip-path: none; overflow: hidden;
  width: min(760px, 96vw); max-width: 96vw; max-height: 94svh; overflow-y: auto;
  padding: 0 0 16px; gap: 10px; align-items: stretch; text-align: center;
  background: linear-gradient(90deg, #d9c18d66, transparent 4%, transparent 96%, #d9c18d66), linear-gradient(160deg, var(--nrv-parch), var(--nrv-parch2));
  border: 1px solid #aa8447; border-top: 5px solid var(--nrv-gold2); border-radius: 4px;
  box-shadow: inset 0 0 0 4px #f6e6bc, 0 22px 70px rgba(0,0,0,.7);
  color: var(--nrv-ink);
}
.pon-result-card.nrv-res::before { display: none; }
.nrv-res-topo { padding: 18px 16px 4px; }
.pon-result-card.nrv-res .pon-result-titulo {
  display: inline-block; padding: 8px 56px; margin: 0;
  font: 900 30px/1.1 Georgia, "Times New Roman", serif; letter-spacing: 6px;
  color: var(--nrv-goldtxt); -webkit-text-fill-color: var(--nrv-goldtxt);
  background: linear-gradient(110deg, var(--nrv-navy), #294e69, var(--nrv-navy));
  border: 2px solid var(--nrv-gold); outline: 1px solid #273d49; outline-offset: 3px;
  box-shadow: 0 6px 14px #49330e55, inset 0 0 0 3px #142e46;
  clip-path: polygon(4% 0, 96% 0, 100% 50%, 96% 100%, 4% 100%, 0 50%);
  text-shadow: 0 2px 3px #000a;
}
.pon-result-card.nrv-res .pon-result-titulo.derrota { background: linear-gradient(110deg, #3a1012, #6e1d20, #3a1012); border-color: #d08a6a; }
.nrv-res-sub { margin-top: 8px; font: 700 13px Georgia, serif; color: #6b5530; letter-spacing: 1px; }
.nrv-res-ganhos { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 0 16px; }
.pon-result-card.nrv-res .pon-pdl-delta {
  padding: 6px 16px; border-radius: 3px; font: 900 18px Georgia, serif; color: var(--nrv-ink);
  background: #fffaf0; border: 2px solid var(--nrv-gold2);
}
.pon-result-card.nrv-res .pon-pdl-delta.positivo { color: #1d6b25; border-color: #4f9a3d; background: #eaf7e2; }
.pon-result-card.nrv-res .pon-pdl-delta.negativo { color: #9a2323; border-color: #c0573f; background: #fbe7e1; }
.pon-result-card.nrv-res .pon-ganho-popup { padding: 6px 14px; border-radius: 3px; background: #fffaf0; border: 1px solid #b6975a; }
.pon-result-card.nrv-res .pon-ganho-lista { font-size: 14px; }
.pon-result-card.nrv-res .pon-liga-popup, .pon-result-card.nrv-res .pon-premio-popup, .pon-result-card.nrv-res .pon-recolocacao-popup { margin: 0 16px; }
.pon-result-card.nrv-res > .pon-btn-primary {
  align-self: center; margin-top: 4px; padding: 11px 28px; border-radius: 3px;
  font: 800 14px Georgia, serif; letter-spacing: 1px;
  background: linear-gradient(#1d3b57, var(--nrv-navy)); color: var(--nrv-goldtxt); border: 2px solid var(--nrv-gold);
}
.pon-result-card.nrv-res > .pon-btn-primary:hover { filter: brightness(1.2); }

/* Placar */
.nrv-res-placar { margin: 2px 14px 0; padding: 10px 10px 12px; border: 1px solid var(--nrv-gold); border-radius: 3px; background: linear-gradient(180deg, var(--nrv-navy3), var(--nrv-navy2)); box-shadow: inset 0 0 0 1px #28455f; color: #fff; }
.nrv-res-sec {
  display: inline-block; margin: 0 0 10px; padding: 3px 22px;
  font: 800 12px/1.4 Georgia, serif; letter-spacing: 2px; text-transform: uppercase;
  color: var(--nrv-ink); background: linear-gradient(var(--nrv-goldtxt), #d9b46a);
  clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 8px 100%, 0 50%);
}
.nrv-res-sec small { text-transform: none; letter-spacing: 0; font-weight: 700; color: #6b4a17; }
.nrv-res-destaques { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.nrv-res-dest {
  --c: #ffd46a; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 8px 6px 9px; min-width: 0;
  background: linear-gradient(90deg, #1c2633, #2a3442 55%, #3a4352); border: 2px solid var(--c);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}
.nrv-res-dest.cura { --c: #7fe08a; }
.nrv-res-dest.recebido { --c: #8cc7ff; }
.nrv-res-dest-tit { font: 800 11px Georgia, serif; letter-spacing: 1px; text-transform: uppercase; color: var(--c); }
.nrv-res-dest-foto { width: 56px; height: 56px; border-radius: 50%; overflow: hidden; border: 3px solid var(--c); background: #0b1826; box-shadow: 0 0 12px color-mix(in srgb, var(--c) 45%, transparent); }
.nrv-res-dest-foto img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.nrv-res-dest-nome { font: 700 14px Georgia, serif; color: #fff; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nrv-res-dest-val { font: 900 16px Nunito, sans-serif; color: var(--c); }
.nrv-res-dest-vazio { font: 900 22px Georgia, serif; color: #8899aa; padding: 18px 0; }
.nrv-res-tabela-wrap { overflow-x: auto; }
.nrv-res-tabela { width: 100%; border-collapse: separate; border-spacing: 0 3px; font: 600 13px Nunito, sans-serif; }
.nrv-res-tabela th { padding: 3px 6px; font: 800 11px Georgia, serif; letter-spacing: 1px; color: var(--nrv-goldtxt); text-align: right; white-space: nowrap; }
.nrv-res-tabela th:first-child { text-align: left; }
.nrv-res-tabela td { padding: 4px 6px; background: #ffffff0d; }
.nrv-res-grupo td { padding: 4px 8px; font: 800 11px Georgia, serif; letter-spacing: 2px; text-transform: uppercase; text-align: left; background: none; }
.nrv-res-grupo.azul td { color: #8cc7ff; border-bottom: 1px solid #5fb2ff66; }
.nrv-res-grupo.vermelho td { color: #ff9d97; border-bottom: 1px solid #ff6b6666; }
.nrv-res-quem { display: flex; align-items: center; gap: 8px; text-align: left; min-width: 150px; }
.nrv-res-quem span { display: flex; flex-direction: column; min-width: 0; }
.nrv-res-quem b { font: 700 13.5px Georgia, serif; }
.nrv-res-quem .pon-log-nome.lado-a { color: #8cc7ff; }
.nrv-res-quem .pon-log-nome.lado-b { color: #ff9d97; }
.nrv-res-quem small { font-size: 10.5px; color: #c9b98f; }
.nrv-res-foto { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; overflow: hidden; border: 2px solid var(--nrv-azul); background: #0b1826; }
.nrv-res-foto.lado-b { border-color: var(--nrv-verm); }
.nrv-res-foto img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.nrv-res-tabela tr.morto .nrv-res-foto { filter: grayscale(1); }
.nrv-res-cel { position: relative; text-align: right; white-space: nowrap; min-width: 92px; }
.nrv-res-cel b { position: relative; z-index: 1; font-weight: 900; color: #fff; }
.nrv-res-barra { position: absolute; left: 0; top: 3px; bottom: 3px; border-radius: 2px; opacity: .35; }
.nrv-res-cel.dano .nrv-res-barra { background: #ffb347; }
.nrv-res-cel.recebido .nrv-res-barra { background: #5fb2ff; }
.nrv-res-cel.cura .nrv-res-barra { background: #6fd27a; }
.nrv-res-cel.top b { color: var(--nrv-goldtxt); }
.nrv-res-cel.top b::before { content: "★ "; color: #ffd46a; }
@media (max-width: 560px) {
  .pon-result-card.nrv-res .pon-result-titulo { font-size: 22px; padding: 7px 34px; letter-spacing: 3px; }
  .nrv-res-destaques { gap: 5px; }
  .nrv-res-dest-foto { width: 44px; height: 44px; }
  .nrv-res-dest-tit { font-size: 9px; letter-spacing: 0; }
  .nrv-res-dest-nome { font-size: 12px; }
  .nrv-res-tabela { font-size: 12px; }
  .nrv-res-quem { min-width: 110px; }
  .nrv-res-quem small { display: none; }
  .nrv-res-cel { min-width: 62px; }
}
/* Destaques em faixa (foto à esquerda) para o popup caber numa tela,
   e o botão de voltar sempre visível no fundo do cartão. */
.nrv-res-dest { display: grid; grid-template-columns: 50px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 9px; row-gap: 0; align-items: center; justify-items: start; padding: 7px 10px; text-align: left; }
.nrv-res-dest .nrv-res-dest-foto { grid-row: 1 / 4; width: 50px; height: 50px; }
.nrv-res-dest-tit, .nrv-res-dest-nome, .nrv-res-dest-val { grid-column: 2; line-height: 1.25; }
.nrv-res-dest-vazio { grid-column: 1 / -1; justify-self: center; padding: 6px 0; }
.nrv-res-topo { padding-top: 14px; }
.pon-result-card.nrv-res .pon-result-titulo { font-size: 26px; padding: 6px 50px; }
.pon-result-card.nrv-res > .pon-btn-primary { position: sticky; bottom: 0; z-index: 2; box-shadow: 0 -6px 14px #eadbbc, 0 4px 10px #0005; }
@media (max-width: 560px) {
  .nrv-res-destaques { grid-template-columns: 1fr; }
  .nrv-res-dest { grid-template-columns: 42px minmax(0, 1fr); }
  .nrv-res-dest .nrv-res-dest-foto { width: 42px; height: 42px; }
}
@media (max-width: 560px) {
  .nrv-res-placar { margin: 2px 8px 0; padding: 8px 6px 10px; }
  .nrv-res-tabela { font-size: 11.5px; }
  .nrv-res-tabela td { padding: 4px 3px; }
  .nrv-res-tabela th { padding: 3px 3px; font-size: 10px; letter-spacing: 0; }
  .nrv-res-cel { min-width: 0; }
  .nrv-res-quem { min-width: 0; gap: 5px; }
  .nrv-res-quem b { font-size: 12px; max-width: 78px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
  .nrv-res-foto { flex-basis: 28px; width: 28px; height: 28px; }
  .nrv-res-cel.top b::before { content: ""; }
}

/* ============================================================
   EFEITOS DE ATAQUE (11/10) — js/pvp-fx.js
   Durações ×1,6 (pedido: dava para ver mal). Só enfeite: não trava cliques.
   ============================================================ */
.nrfx-camada { position: absolute; inset: 0; z-index: 4; pointer-events: none; display: flex; align-items: center; justify-content: center; }
/* Investida de quem ataca (o time vermelho investe para a esquerda) */
#pvponSalaModal .pon-standee.nrfx-investida .pon-standee-img-wrap { animation: nrfxInvestida 0.8s cubic-bezier(.3,1.4,.5,1); }
#pvponSalaModal .pon-standee.lado-b.nrfx-investida .pon-standee-img-wrap { animation-name: nrfxInvestidaB; }
@keyframes nrfxInvestida { 0% { transform: none; } 35% { transform: translateX(26px) scale(1.06); } 100% { transform: none; } }
@keyframes nrfxInvestidaB { 0% { transform: none; } 35% { transform: translateX(-26px) scale(1.06); } 100% { transform: none; } }
/* Quem leva o golpe: tremida + clarão vermelho */
#pvponSalaModal .pon-standee.nrfx-golpeado .pon-standee-img-wrap { animation: nrfxTremida 0.72s linear; }
#pvponSalaModal .pon-standee.nrfx-golpeado .pon-standee-img { animation: nrfxClarao 0.96s ease-out; }
#pvponSalaModal .pon-standee.nrfx-golpeado .nr-fighter-plate { animation: nrfxPlaca 0.96s ease-out; }
@keyframes nrfxTremida { 0%,100% { transform: none; } 15% { transform: translateX(-7px) rotate(-1.5deg); } 30% { transform: translateX(6px) rotate(1deg); } 45% { transform: translateX(-5px); } 60% { transform: translateX(4px); } 80% { transform: translateX(-2px); } }
@keyframes nrfxClarao { 0% { filter: drop-shadow(0 5px 5px #0009) brightness(2.4) saturate(0) sepia(1) hue-rotate(-50deg) saturate(6); } 100% { filter: drop-shadow(0 5px 5px #0009); } }
@keyframes nrfxPlaca { 0% { box-shadow: 0 0 22px #ff3b30; } 100% { box-shadow: none; } }
/* Dano contínuo (queimadura, veneno…): pulso alaranjado sem tremer */
#pvponSalaModal .pon-standee.nrfx-queimando .pon-standee-img { animation: nrfxQueima 0.96s ease-out; }
@keyframes nrfxQueima { 0% { filter: drop-shadow(0 0 14px #ff8a2a) brightness(1.4) sepia(.6); } 100% { filter: drop-shadow(0 5px 5px #0009); } }
/* Riscos de corte */
.nrfx-cortes { position: relative; width: 70%; height: 60%; }
.nrfx-cortes i { position: absolute; left: -10%; width: 120%; height: 4px; border-radius: 4px; background: linear-gradient(90deg, transparent, #fff 30%, #ffe1a8 60%, transparent); box-shadow: 0 0 10px #fff, 0 0 18px #ff9b54; transform-origin: left center; opacity: 0; animation: nrfxCorte 0.72s ease-out forwards; }
.nrfx-cortes i:nth-child(1) { top: 30%; transform: rotate(-28deg); }
.nrfx-cortes i:nth-child(2) { top: 52%; transform: rotate(-20deg); animation-delay: 0.11s; }
.nrfx-cortes i:nth-child(3) { top: 70%; transform: rotate(-34deg); animation-delay: 0.22s; }
.nrfx-cortes.fisico i { height: 6px; background: linear-gradient(90deg, transparent, #fff, transparent); }
@keyframes nrfxCorte { 0% { opacity: 0; clip-path: inset(0 100% 0 0); } 40% { opacity: 1; clip-path: inset(0 0 0 0); } 100% { opacity: 0; clip-path: inset(0 0 0 0); } }
/* A arte do golpe a explodir por cima do alvo */
.nrfx-arte { width: 74px; height: 74px; border-radius: 50%; overflow: hidden; border: 3px solid #ffe7a3; box-shadow: 0 0 18px #ffb347, 0 0 40px #ff6a3d88; animation: nrfxArte 1.36s ease-out forwards; }
.nrfx-arte img { width: 100%; height: 100%; object-fit: cover; display: block; }
@keyframes nrfxArte { 0% { transform: scale(.2) rotate(-40deg); opacity: 0; } 25% { transform: scale(1.15) rotate(0); opacity: 1; } 70% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.6); opacity: 0; } }
/* Números a subir */
.nrfx-num { position: absolute; top: 30%; left: 50%; transform: translateX(-50%); white-space: nowrap;
  font: 900 24px/1 Georgia, "Times New Roman", serif; letter-spacing: 1px;
  -webkit-text-stroke: 1px #2a0d05; text-shadow: 0 3px 4px #000c; animation: nrfxSobe 2s ease-out forwards; }
.nrfx-num.dano { color: #ff5a4a; }
.nrfx-num.continuo { color: #ffad42; font-size: 19px; }
.nrfx-num.cura { color: #7dff9a; -webkit-text-stroke-color: #0b3313; }
.nrfx-num.bloqueio { color: #9fd4ff; font-size: 18px; -webkit-text-stroke-color: #0a2340; }
@keyframes nrfxSobe { 0% { opacity: 0; transform: translate(-50%, 14px) scale(.6); } 15% { opacity: 1; transform: translate(-50%, 0) scale(1.15); } 30% { transform: translate(-50%, -6px) scale(1); } 100% { opacity: 0; transform: translate(-50%, -60px) scale(1); } }
/* Cura e escudo */
#pvponSalaModal .pon-standee.nrfx-curado .pon-standee-img { animation: nrfxCura 1.44s ease-out; }
@keyframes nrfxCura { 0% { filter: drop-shadow(0 0 0 #6fd27a); } 40% { filter: drop-shadow(0 0 16px #6fd27a) brightness(1.25); } 100% { filter: drop-shadow(0 5px 5px #0009); } }
.nrfx-escudo { width: 86%; height: 86%; border-radius: 50%; border: 3px solid #9fd4ff; background: radial-gradient(circle, #5fb2ff00 45%, #5fb2ff55 70%, #5fb2ff00 72%); box-shadow: 0 0 22px #5fb2ff, inset 0 0 22px #5fb2ff88; animation: nrfxEscudo 1.12s ease-out forwards; }
@keyframes nrfxEscudo { 0% { transform: scale(.5); opacity: 0; } 30% { transform: scale(1.05); opacity: 1; } 100% { transform: scale(1.12); opacity: 0; } }
/* Derrotado: cai e escurece */
#pvponSalaModal .pon-standee.nrfx-caiu .pon-standee-img-wrap { animation: nrfxCai 1.44s ease-in; }
@keyframes nrfxCai { 0% { transform: none; filter: none; } 30% { transform: translateY(-6px) rotate(-3deg); } 100% { transform: translateY(8px) rotate(4deg); filter: grayscale(1) brightness(.6); } }
/* Golpe muito forte: a arena treme */
#pvponSalaModal .pon-arena-quadro.nrfx-tremor { animation: nrfxTremor 0.67s linear; }
@keyframes nrfxTremor { 0%,100% { transform: none; } 20% { transform: translate(-4px, 2px); } 40% { transform: translate(4px, -2px); } 60% { transform: translate(-3px, 1px); } 80% { transform: translate(2px, -1px); } }
@media (prefers-reduced-motion: reduce) { .nrfx-num { animation-duration: 2.56s; } }

/* ── Efeitos, 2.ª versão (11/10): camada própria + dano mais chamativo ──
   A camada #nrfxCamada fica fora do modal: quando a tela do combate é
   redesenhada (estado novo do servidor), números, cortes e faíscas não
   são apagados a meio. As classes nos bonecos são repostas por pvp-fx.js
   com --nrfx-atraso negativo, para continuarem de onde estavam. */
#nrfxCamada { position: fixed; inset: 0; pointer-events: none; z-index: 10010; overflow: hidden; }
#nrfxCamada .nrfx-camada { position: absolute; inset: auto; display: flex; align-items: center; justify-content: center; pointer-events: none; }
#pvponSalaModal .pon-standee.nrfx-investida .pon-standee-img-wrap,
#pvponSalaModal .pon-standee.nrfx-golpeado .pon-standee-img-wrap,
#pvponSalaModal .pon-standee.nrfx-golpeado .pon-standee-img,
#pvponSalaModal .pon-standee.nrfx-golpeado .nr-fighter-plate,
#pvponSalaModal .pon-standee.nrfx-queimando .pon-standee-img,
#pvponSalaModal .pon-standee.nrfx-curado .pon-standee-img,
#pvponSalaModal .pon-standee.nrfx-caiu .pon-standee-img-wrap,
#pvponSalaModal .pon-arena-quadro.nrfx-tremor { animation-delay: var(--nrfx-atraso, 0s); animation-fill-mode: both; }

/* Número do dano: maior, salta, e cada um sobe na sua faixa (--dx/--dy) */
#nrfxCamada .nrfx-num {
  top: 26%; font-size: 34px; letter-spacing: .5px; -webkit-text-stroke: 1.5px #2a0d05;
  text-shadow: 0 0 10px #ff2a1a99, 0 4px 6px #000d;
  animation: nrfxSalta 2s cubic-bezier(.2,.9,.3,1) forwards;
}
#nrfxCamada .nrfx-num.dano { color: #ff4b3a; }
#nrfxCamada .nrfx-num.dano.forte {
  font-size: 48px; color: #ffe066; -webkit-text-stroke: 2px #5a0b04;
  text-shadow: 0 0 14px #ff6a00, 0 0 28px #ff2a1a, 0 5px 8px #000e;
  animation-name: nrfxSaltaForte;
}
#nrfxCamada .nrfx-num.continuo { font-size: 24px; color: #ffad42; text-shadow: 0 0 8px #ff8a2a88, 0 3px 4px #000c; }
#nrfxCamada .nrfx-num.cura { font-size: 30px; color: #7dff9a; -webkit-text-stroke-color: #0b3313; text-shadow: 0 0 10px #39d35a88, 0 3px 4px #000c; }
#nrfxCamada .nrfx-num.bloqueio { font-size: 22px; color: #9fd4ff; -webkit-text-stroke-color: #0a2340; text-shadow: 0 0 8px #5fb2ff88, 0 3px 4px #000c; }
@keyframes nrfxSalta {
  0%   { opacity: 0; transform: translate(calc(-50% + var(--dx, 0px)), calc(18px + var(--dy, 0px))) scale(.4); }
  10%  { opacity: 1; transform: translate(calc(-50% + var(--dx, 0px)), calc(-6px + var(--dy, 0px))) scale(1.45); }
  20%  { transform: translate(calc(-50% + var(--dx, 0px)), var(--dy, 0px)) scale(1); }
  28%  { transform: translate(calc(-50% + var(--dx, 0px) - 3px), var(--dy, 0px)) scale(1.04); }
  36%  { transform: translate(calc(-50% + var(--dx, 0px) + 2px), var(--dy, 0px)) scale(1); }
  75%  { opacity: 1; }
  100% { opacity: 0; transform: translate(calc(-50% + var(--dx, 0px)), calc(-56px + var(--dy, 0px))) scale(.95); }
}
@keyframes nrfxSaltaForte {
  0%   { opacity: 0; transform: translate(calc(-50% + var(--dx, 0px)), calc(10px + var(--dy, 0px))) scale(.3) rotate(-8deg); }
  9%   { opacity: 1; transform: translate(calc(-50% + var(--dx, 0px)), calc(-10px + var(--dy, 0px))) scale(1.7) rotate(4deg); }
  18%  { transform: translate(calc(-50% + var(--dx, 0px)), var(--dy, 0px)) scale(1.05) rotate(-2deg); }
  26%  { transform: translate(calc(-50% + var(--dx, 0px)), var(--dy, 0px)) scale(1.15) rotate(0); }
  34%  { transform: translate(calc(-50% + var(--dx, 0px)), var(--dy, 0px)) scale(1); }
  78%  { opacity: 1; }
  100% { opacity: 0; transform: translate(calc(-50% + var(--dx, 0px)), calc(-64px + var(--dy, 0px))) scale(1); }
}
/* Faísca de impacto atrás do número */
.nrfx-faisca { width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle, #fff 0 8%, #ffd36a 14%, #ff6a2a66 34%, transparent 60%),
              conic-gradient(from 0deg, transparent 0 6%, #fff8 7% 9%, transparent 10% 22%, #ffd36a99 23% 25%, transparent 26% 40%, #fff8 41% 43%, transparent 44% 58%, #ffd36a99 59% 61%, transparent 62% 76%, #fff8 77% 79%, transparent 80% 100%);
  mix-blend-mode: screen; animation: nrfxFaisca .9s ease-out forwards; }
.nrfx-faisca.forte { width: 180px; height: 180px; }
@keyframes nrfxFaisca { 0% { transform: scale(.2) rotate(0); opacity: 0; } 15% { transform: scale(1.1) rotate(20deg); opacity: 1; } 100% { transform: scale(1.5) rotate(60deg); opacity: 0; } }
/* Clarão vermelho nas bordas da arena num golpe forte */
#pvponSalaModal .pon-arena-quadro.nrfx-clarao-borda::after {
  content: ""; position: absolute; inset: 0; z-index: 6; pointer-events: none;
  box-shadow: inset 0 0 90px 20px #ff1a0acc; animation: nrfxBorda 1.1s ease-out forwards; animation-delay: var(--nrfx-atraso, 0s);
}
@keyframes nrfxBorda { 0% { opacity: 0; } 15% { opacity: 1; } 100% { opacity: 0; } }
/* Rasto vermelho na barra de vida (o pedaço que acabou de sair) */
#pvponSalaModal .pon-hp-bar-wrap { position: relative; }
.nrfx-hp-rasto { position: absolute; top: 0; bottom: 0; background: linear-gradient(90deg, #fff, #ff5a3a); box-shadow: 0 0 8px #ff5a3a; animation: nrfxRasto 1.7s ease-in forwards; transform-origin: left center; }
@keyframes nrfxRasto { 0% { transform: scaleX(1); opacity: 1; } 35% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(0); opacity: .6; } }
/* Números e pausas mais legíveis no celular */
@media (max-width: 600px) {
  #nrfxCamada .nrfx-num { font-size: 26px; }
  #nrfxCamada .nrfx-num.dano.forte { font-size: 36px; }
  .nrfx-faisca { width: 90px; height: 90px; } .nrfx-faisca.forte { width: 130px; height: 130px; }
}

/* ═══ 12/10 — 5v5 ═══════════════════════════════════════════════════
   Mesmas telas do 1v1/2v2/3v3; aqui só o tamanho das coisas para caberem
   cinco de cada lado. */
.ne-mode-buttons { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ne-mode:nth-child(4) { background-image: linear-gradient(#123c6199, #071d36ee), url('../img/arena_pvp/vale-fim-redesign.png'); }
.pvpon-modo-badge.modo-5v5 { background: #6a2f8e; }
/* Sala de batalha */
#pvponSalaModal .nr-mode-5 .nr-room-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
#pvponSalaModal .nr-mode-5 .nr-room-art { height: clamp(100px, 17vh, 210px); }
#pvponSalaModal .nr-mode-5 .nr-room-name { padding: 5px 3px; }
#pvponSalaModal .nr-mode-5 .nr-room-name strong { font-size: 12px; }
#pvponSalaModal .nr-mode-5 .nr-room-name small, #pvponSalaModal .nr-mode-5 .nr-room-ready { font-size: 10px; }
/* Combate: cinco bonecos por lado, em ziguezague como no 3v3 */
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standees-arena { gap: 6px; grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr); }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standees-col { gap: 2px; }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee { max-width: 150px; }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee:nth-child(even) { align-self: center; }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee-img-wrap { height: clamp(70px, 16vh, 200px); }
#pvponSalaModal.nr-battle-body[data-mode="5"] .nr-fighter-plate { padding: 3px 5px 4px; }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee-nome { font-size: 11px; }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee-nome small { font-size: 9px; }
#pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee-hp-txt { font-size: 10px; }
@media (max-width: 760px) {
  .ne-mode-buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #pvponSalaModal .nr-mode-5 .nr-room-art { height: 80px; }
}
@media (max-width: 480px) {
  #pvponSalaModal.nr-battle-body[data-mode="5"] .pon-arena-quadro { height: 860px; }
  #pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee-img-wrap { height: 72px; }
  #pvponSalaModal.nr-battle-body[data-mode="5"] .pon-standee:nth-child(even) { align-self: center; }
}

/* 12/10 — Poções de Vida: 2 espaços pequenos ao lado de "Passar a vez". */
.nr-pocoes { display: inline-flex; gap: 4px; align-items: center; margin-left: 4px; }
.nr-pocao { position: relative; width: 34px; height: 34px; padding: 2px; border-radius: 6px; border: 1px solid #e8b04a; background: radial-gradient(circle at 50% 35%, #5a1d1d, #1c0c0c); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 0 6px #e74c3c55; }
.nr-pocao:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 0 10px #ff6b6baa; }
.nr-pocao img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.nr-pocao.is-off { cursor: not-allowed; filter: grayscale(.85); opacity: .6; }
.nr-pocao-qtd { position: absolute; right: -4px; bottom: -4px; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 8px; background: #111; color: #fff; font: 800 9px/15px system-ui, sans-serif; text-align: center; }
.nr-pocao-cd { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; border-radius: 6px; background: #000a; color: #ffd27a; font: 800 13px system-ui, sans-serif; }
.nr-pocao-vazia { cursor: default; border-style: dashed; border-color: #8b7a55; background: #0004; color: #8b7a55; font: 800 14px system-ui, sans-serif; box-shadow: none; }

/* 12/10 — Poção de Vida: a poção sobe e some, anel verde e bolhas a subir. */
.nrfx-pocao { position: relative; width: 100%; height: 100%; display: block; }
.nrfx-pocao-img { position: absolute; left: 50%; top: 45%; width: 46%; max-width: 90px; transform: translate(-50%, -50%); filter: drop-shadow(0 0 12px #7dff9a); animation: nrfxPocaoSobe 1.5s ease-out forwards; }
@keyframes nrfxPocaoSobe { 0% { transform: translate(-50%, -10%) scale(.4); opacity: 0; } 25% { transform: translate(-50%, -50%) scale(1.05); opacity: 1; } 60% { transform: translate(-50%, -60%) scale(1) rotate(-12deg); opacity: 1; } 100% { transform: translate(-50%, -110%) scale(.7) rotate(-25deg); opacity: 0; } }
.nrfx-pocao-anel { position: absolute; left: 50%; bottom: 4%; width: 90%; height: 26%; border-radius: 50%; transform: translateX(-50%); border: 3px solid #7dff9a; box-shadow: 0 0 22px #39d35a, inset 0 0 18px #39d35a99; animation: nrfxPocaoAnel 1.4s ease-out forwards; }
@keyframes nrfxPocaoAnel { 0% { transform: translateX(-50%) scale(.3); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateX(-50%) scale(1.25); opacity: 0; } }
.nrfx-pocao i { position: absolute; bottom: 8%; width: 10px; height: 10px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #eaffef, #6fe38a 60%, #2fae4f); box-shadow: 0 0 8px #6fe38a; opacity: 0; animation: nrfxBolha 1.4s ease-out forwards; }
.nrfx-pocao i:nth-of-type(1) { left: 18%; animation-delay: .05s; }
.nrfx-pocao i:nth-of-type(2) { left: 32%; width: 7px; height: 7px; animation-delay: .25s; }
.nrfx-pocao i:nth-of-type(3) { left: 46%; animation-delay: .12s; }
.nrfx-pocao i:nth-of-type(4) { left: 58%; width: 13px; height: 13px; animation-delay: .35s; }
.nrfx-pocao i:nth-of-type(5) { left: 70%; width: 8px; height: 8px; animation-delay: .18s; }
.nrfx-pocao i:nth-of-type(6) { left: 82%; animation-delay: .42s; }
.nrfx-pocao i:nth-of-type(7) { left: 40%; width: 6px; height: 6px; animation-delay: .5s; }
@keyframes nrfxBolha { 0% { transform: translateY(0) scale(.6); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(-260%) translateY(-120px) scale(1.1); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .nrfx-pocao { display: none; } }
