/* ---------- Pokecenter healing animation ---------- */
.heal-overlay {
  position: fixed; inset: 0; z-index: 60;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(ellipse at center, rgba(255,245,235,.96), rgba(243,245,250,.98));
  animation: heal-in .3s ease-out;
}
.heal-overlay.fade { animation: heal-out .32s ease-in forwards; }
@keyframes heal-in  { from { opacity: 0; } to { opacity: 1; } }
@keyframes heal-out { from { opacity: 1; } to { opacity: 0; } }

.heal-scene { position: relative; width: min(92vw, 420px); text-align: center; }
.heal-title { font-size: 22px; font-weight: 800; margin-bottom: 18px; color: var(--text); }

/* The machine */
.heal-machine {
  position: relative; margin: 0 auto; width: 100%; max-width: 360px;
  background: linear-gradient(#f7f8fc, #dfe3ec);
  border: 3px solid #1f2430; border-radius: 22px 22px 14px 14px;
  padding: 16px 16px 0; box-shadow: 0 14px 34px rgba(0,0,0,.18);
}
.heal-screen {
  height: 54px; border-radius: 10px; background: #2b3a4a; border: 3px solid #1f2430;
  display: flex; align-items: center; justify-content: center;
  color: #7df9a7; font: 700 18px/1 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  letter-spacing: 4px; text-shadow: 0 0 8px #7df9a7;
}
.heal-screen-text { opacity: .35; }
.healing .heal-screen-text { opacity: 1; animation: blink .22s steps(2) infinite; }
@keyframes blink { to { opacity: .35; } }

.heal-lights { display: flex; gap: 10px; justify-content: center; margin: 12px 0; }
.heal-lights i {
  width: 14px; height: 14px; border-radius: 50%; background: #c7ccd8; border: 2px solid #1f2430;
}
.healing .heal-lights i { animation: light 0.44s ease-in-out infinite; background: #ffd23f; box-shadow: 0 0 10px #ffd23f; }
.healing .heal-lights i:nth-child(2) { animation-delay: .11s; }
.healing .heal-lights i:nth-child(3) { animation-delay: .22s; }
.healing .heal-lights i:nth-child(4) { animation-delay: .33s; }
@keyframes light { 0%, 100% { background: #ffd23f; } 50% { background: #e3350d; box-shadow: 0 0 12px #e3350d; } }

/* Six ball slots on the tray */
.heal-tray {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px;
  background: #9aa3b5; border: 3px solid #1f2430; border-bottom: none; border-radius: 12px 12px 0 0;
  padding: 10px;
}
.heal-slot {
  position: relative; aspect-ratio: 1; border-radius: 50%;
  background: #6c7589; box-shadow: inset 0 3px 6px rgba(0,0,0,.4);
}
.heal-slot.empty { opacity: .45; }
.heal-glow {
  position: absolute; inset: -4px; border-radius: 50%; opacity: 0;
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(125,249,167,.6) 55%, transparent 75%);
}
.heal-slot.filled .heal-glow { opacity: .5; }
.healing .heal-slot.filled .heal-glow { animation: glow .44s ease-in-out infinite; }
.healing .heal-slot.filled:nth-child(2) .heal-glow { animation-delay: .07s; }
.healing .heal-slot.filled:nth-child(3) .heal-glow { animation-delay: .14s; }
.healing .heal-slot.filled:nth-child(4) .heal-glow { animation-delay: .21s; }
.healing .heal-slot.filled:nth-child(5) .heal-glow { animation-delay: .28s; }
.healing .heal-slot.filled:nth-child(6) .heal-glow { animation-delay: .35s; }
@keyframes glow { 0%, 100% { opacity: .35; transform: scale(1); } 50% { opacity: 1; transform: scale(1.25); } }

.heal-base {
  height: 18px; margin: 0 -19px -3px; background: #1f2430; border-radius: 0 0 14px 14px;
}
.heal-machine.healing { animation: hum .44s ease-in-out infinite; }
@keyframes hum { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }

/* Pokeballs waiting below the machine */
.heal-balls { display: flex; gap: 10px; justify-content: center; margin-top: 34px; min-height: 44px; }
.pokeball {
  width: 44px; height: 44px; display: block; position: relative; z-index: 2;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,.3));
  animation: idle 1.2s ease-in-out infinite; animation-delay: calc(var(--i) * .1s);
}
@keyframes idle { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.pokeball.fly {
  animation: fly .32s cubic-bezier(.3,.9,.4,1.05) forwards;
}
@keyframes fly {
  0%   { transform: translate(0, 0) rotate(0) scale(1); }
  60%  { transform: translate(calc(var(--dx) * .6), calc(var(--dy) * 1.25)) rotate(220deg) scale(.95); }
  100% { transform: translate(var(--dx), var(--dy)) rotate(360deg) scale(.78); opacity: 1; }
}
.heal-overlay.healing .pokeball.fly { animation: fly-sit .44s ease-in-out infinite; }
@keyframes fly-sit {
  0%, 100% { transform: translate(var(--dx), var(--dy)) rotate(360deg) scale(.78); filter: brightness(1) drop-shadow(0 4px 6px rgba(0,0,0,.3)); }
  50%      { transform: translate(var(--dx), var(--dy)) rotate(360deg) scale(.84); filter: brightness(1.5) drop-shadow(0 0 10px #7df9a7); }
}
.heal-overlay.done .pokeball.fly { animation: none; transform: translate(var(--dx), var(--dy)) rotate(360deg) scale(.78); }

/* Sparkles once everyone is healed */
.heal-sparkles { position: absolute; inset: 0; pointer-events: none; overflow: visible; }
.heal-sparkles span {
  position: absolute; left: var(--sx); bottom: 30%; width: 8px; height: 8px; opacity: 0;
  background: #ffd23f; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
}
.heal-overlay.done .heal-sparkles span { animation: sparkle 1s ease-out forwards; animation-delay: var(--sd); }
@keyframes sparkle {
  0%   { opacity: 0; transform: translateY(0) scale(.4); }
  30%  { opacity: 1; transform: translateY(-40px) scale(1.4); }
  100% { opacity: 0; transform: translateY(-140px) scale(.6) rotate(180deg); }
}
.heal-done {
  margin-top: 16px; font-size: 26px; font-weight: 800; color: var(--ok); opacity: 0;
  transform: translateY(8px); transition: opacity .3s, transform .3s;
}
.heal-overlay.done .heal-done { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .pokeball, .heal-machine.healing, .healing .heal-lights i, .healing .heal-slot.filled .heal-glow,
  .heal-overlay.healing .pokeball.fly { animation: none; }
  .pokeball.fly { transform: translate(var(--dx), var(--dy)) scale(.78); }
  .healing .heal-lights i { background: #ffd23f; }
}
