/* Barra de EXP (ui/xp-bars.js): um fio fino colado logo abaixo da barra de vida. */
.xp-bar { --xp-a: #38bdf8; --xp-b: #818cf8; position: relative; display: block; width: 100%; min-width: 0; margin-top: 1px; }
.xp-bar-track { position: relative; display: block; height: 3px; border-radius: 0 0 3px 3px; overflow: hidden; background: #050b16cc; }
.xp-bar-fill { position: absolute; inset: 0 auto 0 0; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--xp-a), var(--xp-b)); box-shadow: 0 0 .3rem #38bdf877; transition: width .4s ease; }
.xp-bar.is-max { --xp-a: #fbbf24; --xp-b: #f97316; }
.xp-bar.is-filling .xp-bar-fill { transition: none; box-shadow: 0 0 .5rem #7dd3fc, 0 0 .9rem #818cf888; }
.xp-bar.is-levelup .xp-bar-track { animation: xpTrackFlash .5s ease-out; }
.xp-bar.is-levelup::after { content: "LEVEL UP!"; position: absolute; right: 0; top: -1.3rem; color: #fde047; font: 800 .68rem var(--font-pixel-ui); letter-spacing: .08em; text-shadow: 0 0 .5rem #fbbf24, 0 2px 0 #7c2d12; pointer-events: none; animation: xpLevelText 1.1s ease-out forwards; white-space: nowrap; z-index: 2; }
.xp-spark { position: absolute; top: 50%; width: 4px; height: 4px; border-radius: 1px; background: #fde68a; box-shadow: 0 0 6px #fbbf24; pointer-events: none; animation: xpSpark .9s ease-out forwards; }

/* Encaixe em cada tela: a barra de vida perde a borda inferior arredondada para os dois se fundirem. */
.lobby-squad-card .lsc-hp-bar { border-bottom-left-radius: 1px; border-bottom-right-radius: 1px; }
.lobby-squad-card .xp-bar { margin-top: -2px; margin-bottom: .1rem; }
#squadScreen .slot-hp-info .xp-bar { grid-column: 1 / -1; margin-top: -2px; }
#squadScreen .slot-hp-track { border-bottom-left-radius: 1px; border-bottom-right-radius: 1px; }
#playerHudCard .hud-hp-track { margin-bottom: 0; border-bottom-left-radius: 1px; border-bottom-right-radius: 1px; }
.hud-xp-row { margin: 0 0 .1875rem; }
.hud-xp-row:empty { margin: 0 0 .1875rem; height: 0; }
.hud-xp-row .xp-bar { margin-top: 1px; }
.end-poke-card .end-poke-hp-track { border-bottom-left-radius: 1px; border-bottom-right-radius: 1px; }

/* Nível logo à direita do nome (Torre, Meu Time, batalha e fim de batalha), só no PC. */
html:not(.battlemon-mobile) :is(.lobby-squad-card .lsc-top, .end-poke-name-row) { justify-content: flex-start; gap: .45rem; }
html:not(.battlemon-mobile) #squadScreen .slot-name-row { justify-content: flex-start; gap: .4rem; }
html:not(.battlemon-mobile) #battleScreen .hud-top { justify-content: flex-start; gap: .5rem; }

@keyframes xpTrackFlash { 0% { box-shadow: none; } 30% { box-shadow: 0 0 .6rem #fde047; } 100% { box-shadow: none; } }
@keyframes xpLevelText { 0% { opacity: 0; transform: translateY(.4rem) scale(.8); } 25% { opacity: 1; transform: translateY(0) scale(1.1); } 75% { opacity: 1; } 100% { opacity: 0; transform: translateY(-.5rem); } }
@keyframes xpSpark { from { transform: translate(0, 0) scale(1); opacity: 1; } to { transform: translate(var(--dx), var(--dy)) scale(0); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .xp-bar.is-levelup .xp-bar-track, .xp-bar.is-levelup::after { animation: none; } }