/* V1.76 · Brief portrait-local recovery closure after leaving critical health. */
#battle:not([hidden]) :is(.fighter, .seat-fighter).health-recovered-combatant :is(.avatar, .team-art) {
  position: relative;
  isolation: isolate;
}

#battle:not([hidden]) :is(.fighter, .seat-fighter) :is(.avatar, .team-art) > .health-recovery-cue {
  position: absolute;
  z-index: 15;
  inset: 4px;
  display: block;
  overflow: visible;
  border: 1px solid rgba(111, 236, 197, .76);
  border-radius: 6px;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(76, 222, 178, .2), transparent 58%),
    linear-gradient(180deg, rgba(122, 238, 223, .09), transparent 30% 72%, rgba(39, 135, 122, .12));
  box-shadow:
    inset 0 0 20px rgba(72, 213, 176, .17),
    0 0 12px rgba(80, 222, 195, .28);
  pointer-events: none;
  animation: critical-health-recovery-close 920ms cubic-bezier(.18,.74,.18,1) both;
}

#battle:not([hidden]) .health-recovery-cue > strong {
  position: absolute;
  top: 5px;
  right: 5px;
  display: inline-flex;
  align-items: center;
  min-height: 16px;
  padding: 2px 6px 3px;
  border: 1px solid rgba(174, 255, 224, .62);
  border-radius: 999px;
  color: #e9fff7;
  background: linear-gradient(180deg, rgba(26, 124, 106, .94), rgba(5, 43, 42, .95));
  box-shadow: inset 0 1px rgba(255,255,255,.15), 0 3px 9px rgba(1, 24, 24, .34);
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: .1em;
  text-shadow: 0 1px 2px rgba(0,0,0,.68);
  white-space: nowrap;
}

#battle:not([hidden]) .seat-fighter.health-recovered-combatant .team-art > .health-recovery-cue {
  inset: 3px;
}

#battle:not([hidden]) .seat-fighter.health-recovered-combatant .team-art > .health-recovery-cue > strong {
  top: 3px;
  right: 3px;
  min-height: 13px;
  padding: 1px 4px 2px;
  font-size: 6px;
}

@keyframes critical-health-recovery-close {
  0% {
    opacity: 0;
    transform: scale(.985);
    filter: brightness(1.28);
  }
  16%, 54% {
    opacity: 1;
    transform: scale(1);
    filter: brightness(1.08);
  }
  100% {
    opacity: 0;
    transform: scale(1.008);
    filter: brightness(1);
  }
}

body[data-vfx-quality="low"] #battle:not([hidden]) .health-recovery-cue {
  box-shadow: inset 0 0 10px rgba(72, 213, 176, .12);
  animation-duration: 640ms;
}

@media (max-width: 720px) {
  #battle:not([hidden]) .fighter.health-recovered-combatant .avatar > .health-recovery-cue {
    inset: 3px;
  }

  #battle:not([hidden]) .fighter.health-recovered-combatant .avatar > .health-recovery-cue > strong {
    top: 3px;
    right: 3px;
    min-height: 14px;
    padding: 1px 5px 2px;
    font-size: 7px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #battle:not([hidden]) .health-recovery-cue {
    animation-duration: 160ms !important;
    animation-iteration-count: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}
