/* --- badge linger +0.5s (total ~3.1s) --- */
.tte-hud-badge { animation: tteBadgeFade 3.1s ease forwards; }
@keyframes tteBadgeFade {
  0% { opacity: 0; transform: translate(-50%, -6px) scale(.98); }
  8% { opacity: 1; transform: translate(-50%, 0) scale(1); }
  86% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, 6px) scale(.98); }
}

/* chips linger extended to match */
.tte-chip { animation: tteChip 3.1s ease forwards; }
@keyframes tteChip {
  0% { opacity: 0; transform: translateY(-6px) scale(.96); }
  10% { opacity: 1; transform: translateY(0) scale(1); }
  88% { opacity: 1; }
  100% { opacity: 0; transform: translateY(4px) scale(.98); }
}

/* explainer panel unchanged */

/* --- highlight edge numbers on the card itself --- */
/* We’ll try to locate .n-top/.n-right/.n-bottom/.n-left or [data-side="top"|...] spans. */
.tte-edge-buff, .tte-edge-nerf {
  position: relative;
  font-weight: 800;
  text-shadow: 0 0 1px rgba(0,0,0,.35);
  transition: color .15s ease, transform .15s ease;
  will-change: transform;
}
.tte-edge-buff { color: #10b981 !important; } /* green */
.tte-edge-nerf { color: #ef4444 !important; } /* red  */

.tte-edge-bump {
  animation: tteEdgeBump .35s ease;
}
@keyframes tteEdgeBump {
  0% { transform: scale(1); }
  30% { transform: scale(1.22); }
  100% { transform: scale(1); }
}

/* small floating delta bubble next to the number */
.tte-delta-bubble {
  position: absolute; z-index: 2; pointer-events: none;
  background: #111827; border: 1px solid rgba(255,255,255,.15);
  border-radius: 6px; padding: 2px 5px; font-size: 11px; font-weight: 700;
  color: #e5e7eb; opacity: 0; transform: translateY(-4px) scale(.96);
  animation: tteDelta 1.2s ease forwards;
}
.tte-delta-bubble.ok { border-color: rgba(16,185,129,.6); color: #10b981; } /* green */
.tte-delta-bubble.bad { border-color: rgba(239,68,68,.6); color: #ef4444; }  /* red  */
@keyframes tteDelta {
  0% { opacity: 0; transform: translateY(-4px) scale(.96); }
  12% { opacity: 1; transform: translateY(0) scale(1); }
  75% { opacity: 1; }
  100% { opacity: 0; transform: translateY(4px) scale(.98); }
}

/* flip ring unchanged */