/* v2.33: resolve battle information in causal order: card impact -> damage -> troop HP. */

.battle-screen.battle-visual-upgraded .fighter .hpbar > span {
  transition: width .36s cubic-bezier(.2, .75, .2, 1);
}

/* 2x playback must compress the visible collision sequence as well as the round timer. */
.battle-screen.battle-visual-upgraded.visual-speed-2 .round-sequence .card-resolution-banner {
  animation: resultMark .225s .575s ease-out both;
}

.battle-screen.battle-visual-upgraded.visual-speed-2 .round-sequence .strike-left {
  animation: strike-left .26s .75s ease both;
}

.battle-screen.battle-visual-upgraded.visual-speed-2 .round-sequence .strike-right {
  animation: strike-right .26s .75s ease both;
}

.battle-screen.battle-visual-upgraded.visual-speed-2 .round-sequence .clash-flash {
  animation-delay: .775s;
}

.battle-screen.battle-visual-upgraded.visual-speed-2 .round-sequence .damage-pop {
  animation: damageFloat .4s .875s ease-out both;
}

.battle-screen.battle-visual-upgraded.visual-speed-2 .round-sequence .battle-log-area {
  animation: resultMark .21s 1.175s ease-out both;
}

.battle-screen.battle-visual-upgraded.visual-speed-2 .fighter .hpbar > span {
  transition-duration: .18s;
}

/* End-of-battle dialogue: victory is warm/red, defeat is cool blue-gray. */
.battle-screen.battle-visual-upgraded .fighter-card-effect.dialogue.dialogue-victory {
  border-color: rgba(220, 91, 76, .52);
  border-left: 3px solid #d85b4c;
  background:
    radial-gradient(circle at 50% 0%, rgba(238, 98, 78, .16), transparent 48%),
    linear-gradient(145deg, rgba(100, 31, 28, .76), rgba(31, 14, 15, .92));
  box-shadow: inset 0 1px rgba(255, 196, 183, .08), 0 8px 24px rgba(82, 16, 13, .2);
}

.battle-screen.battle-visual-upgraded .fighter-card-effect.dialogue.dialogue-victory .fighter-end-dialogue {
  color: #ffe8df;
}

.battle-screen.battle-visual-upgraded .fighter-card-effect.dialogue.dialogue-defeat {
  border-color: rgba(111, 139, 164, .42);
  border-left: 3px solid #71869a;
  background:
    radial-gradient(circle at 50% 0%, rgba(111, 151, 184, .12), transparent 48%),
    linear-gradient(145deg, rgba(38, 50, 61, .82), rgba(17, 20, 24, .94));
  box-shadow: inset 0 1px rgba(205, 224, 240, .05), 0 8px 24px rgba(5, 12, 19, .2);
}

.battle-screen.battle-visual-upgraded .fighter-card-effect.dialogue.dialogue-defeat .fighter-end-dialogue {
  color: #dbe4eb;
}