/* Босс сервера — модуль pvp_boss */
.pb { padding: 8px 2px 16px; display: flex; flex-direction: column; gap: 10px; max-width: 100%; overflow: hidden; }
.pb-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pb-name { font-family: var(--font-head); font-size: 15px; line-height: 1.2; color: var(--gold); min-width: 0; overflow-wrap: anywhere; }
.pb-emo { margin-right: 6px; }
.pb-timer { flex: none; font-size: 12px; color: var(--muted); background: var(--card); border: 1px solid var(--card-b); border-radius: 999px; padding: 3px 9px; white-space: nowrap; }

.pb-hp { position: relative; height: 22px; border-radius: 11px; background: rgba(255, 59, 59, .12); border: 1px solid rgba(255, 59, 59, .35); overflow: hidden; }
.pb-hp-fill { position: absolute; inset: 0 auto 0 0; width: 100%; background: linear-gradient(90deg, #b3141a, var(--red), #ff7a45); box-shadow: 0 0 12px rgba(255, 59, 59, .5); transition: width .35s ease-out; }
.pb-hp-txt { position: relative; z-index: 1; text-align: center; font-size: 12px; font-weight: 700; line-height: 22px; text-shadow: 0 1px 2px #000; }

.pb-arena { position: relative; height: 184px; display: flex; align-items: center; justify-content: center; border-radius: 18px;
  background: radial-gradient(circle at 50% 60%, rgba(255, 210, 63, .12), transparent 65%), var(--card); border: 1px solid var(--card-b);
  touch-action: manipulation; cursor: pointer; overflow: hidden; -webkit-user-select: none; user-select: none; }
.pb-arena:active { background-color: rgba(255, 59, 59, .06); }
.pb-face { width: 150px; height: 166px; pointer-events: none; }
.pb-svg { width: 100%; height: 100%; display: block; }
.pb-dead { filter: grayscale(1) brightness(.75); }
.pb-shake { animation: pb-shake .18s linear; }
@keyframes pb-shake {
  0% { transform: translate(0, 0) rotate(0); }
  25% { transform: translate(-5px, 2px) rotate(-3deg); }
  50% { transform: translate(4px, -2px) rotate(2deg); }
  75% { transform: translate(-2px, 1px) rotate(-1deg); }
  100% { transform: translate(0, 0) rotate(0); }
}
.pb-float { position: absolute; pointer-events: none; transform: translate(-50%, -50%); font-family: var(--font-head); font-size: 22px; color: var(--red);
  text-shadow: 0 2px 4px #000; animation: pb-float .7s ease-out forwards; }
@keyframes pb-float { to { transform: translate(-50%, -260%); opacity: 0; } }
.pb-stamp { display: none; position: absolute; top: 44%; left: 50%; transform: translate(-50%, -50%) rotate(-14deg); pointer-events: none;
  font-family: var(--font-head); font-size: 30px; letter-spacing: 2px; color: var(--red); border: 4px solid var(--red); border-radius: 10px; padding: 2px 12px;
  background: rgba(0, 0, 0, .35); }
.pb-is-dead .pb-stamp { display: block; }
.pb-is-dead .pb-arena { cursor: default; }

.pb-my { font-size: 13px; text-align: center; }
.pb-pend { color: var(--neon); }
.pb-gold { color: var(--gold); }
.pb-hint { font-size: 11.5px; color: var(--muted); text-align: center; line-height: 1.35; }
.pb-box { background: var(--card); border: 1px solid var(--card-b); border-radius: 14px; padding: 8px 10px; }
.pb-h { font-size: 13px; font-weight: 700; margin-bottom: 4px; }
.pb-top { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.pb-top li { display: flex; justify-content: space-between; gap: 8px; padding: 4px 2px; border-bottom: 1px solid var(--card-b); }
.pb-top li:last-child { border-bottom: 0; }
.pb-top li span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-top li b { flex: none; color: var(--gold); }
.pb-top .pb-me { color: var(--neon); }
.pb-empty { color: var(--muted); justify-content: center !important; }
.pb-last { font-size: 12.5px; line-height: 1.4; }
.pb-lasttop { color: var(--muted); font-size: 11.5px; margin-top: 2px; }
.pb-guest { align-items: center; text-align: center; font-size: 13px; }
.pb-guest .pb-svgbox { width: 140px; height: 154px; opacity: .8; }

/* «Лайт»/батарея: без тряски и полёта цифр */
html.lite .pb-shake, html.lite .pb-float { animation: none; }
html.lite .pb-float { display: none; }
html.lite .pb-hp-fill { transition: none; }
@media (max-height: 640px) { .pb-arena { height: 150px; } .pb-face { width: 124px; height: 136px; } }
