/* Каратека фигурками. Общий для зального экрана и мини-аппа: размеры тянутся
   от --ka-h, всё остальное одинаково. */

.ka-stage{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;--ka-h:150px;}
.ka-stage.big{--ka-h:clamp(170px,26vh,300px);}

.ka-duel{
  display:flex;align-items:flex-end;justify-content:center;gap:clamp(14px,3vw,54px);
  width:100%;padding-bottom:10px;border-bottom:3px solid var(--line);
}

.ka-fighter{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;}
.ka-body{
  height:var(--ka-h);width:calc(var(--ka-h) * .8);
  transition:transform .18s ease;
}
.ka-svg{display:block;width:100%;height:100%;overflow:visible;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.34));}

/* Второй боец смотрит на первого. Зеркалим ТЕЛО, а не карточку: имя и полоса
   здоровья должны читаться слева направо у обоих. */
.ka-fighter.mirror .ka-body{transform:scaleX(-1);}

/* Раненый в этом раунде отшатывается — в ту же сторону у обоих, «от центра». */
.ka-fighter.hit .ka-body{transform:translateX(-13px) rotate(-7deg);}
.ka-fighter.mirror.hit .ka-body{transform:scaleX(-1) translateX(-13px) rotate(-7deg);}
.ka-fighter.hit .ka-svg{filter:drop-shadow(0 3px 3px rgba(0,0,0,.34)) brightness(1.3) saturate(1.25);}

/* Дыхание: фигура живая даже когда ничего не происходит — минуту ожидания
   выбора приёма зал иначе читает как зависший экран. */
@keyframes ka-breathe{0%,100%{transform:translateY(0);}50%{transform:translateY(-3px);}}
.ka-body .ka-svg{animation:ka-breathe 1.8s ease-in-out infinite;}
@media (prefers-reduced-motion: reduce){.ka-body .ka-svg{animation:none;}}

/* Здоровье: пять делений, как HP0 в игре. Цвет — свой у каждого бойца, тот же,
   что кимоно: зал сопоставляет полосу с фигурой без легенды. */
.ka-hp{display:flex;gap:4px;}
.ka-pip{
  width:calc(var(--ka-h) * .085);height:calc(var(--ka-h) * .05);border-radius:3px;
  background:var(--card-hi);
}
.ka-pip.on.s0{background:var(--accent);}
.ka-pip.on.s1{background:var(--blue);}

.ka-name{font-weight:900;font-size:calc(var(--ka-h) * .1);letter-spacing:.01em;}
.ka-act,.ka-ready{
  font-size:calc(var(--ka-h) * .085);font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;min-height:1.2em;
}
.ka-act{color:var(--text);}
.ka-act.blank{opacity:0;}
.ka-ready{color:var(--up);}

.ka-vs{
  color:var(--muted);font-weight:900;letter-spacing:.14em;text-transform:uppercase;
  font-size:calc(var(--ka-h) * .09);padding-bottom:calc(var(--ka-h) * .28);
}
.ka-caption{color:var(--muted);font-weight:700;font-size:calc(var(--ka-h) * .085);}
