/* Shared keyframes used across multiple stylesheets (B1.4).
   Single source of truth — do NOT redefine these in component files. */

@keyframes gemHalo {
  0%, 100% { opacity: .15; transform: scale(.9); }
  50% { opacity: .45; transform: scale(1.1); }
}

@keyframes fireflyPulse {
  0%, 100% { opacity: .12; }
  50% { opacity: .9; }
}

/* Sporty motion polish (restrained: one-shot, never looping). */

/* Speed-streak — a thin diagonal cyan glint that sweeps across ONCE.
   Use on screen-in or a button press via .fx-streak (needs position + overflow:hidden on host). */
@keyframes speedStreak {
  0%   { transform: translateX(-160%) skewX(-18deg); opacity: 0; }
  12%  { opacity: .55; }
  100% { transform: translateX(160%) skewX(-18deg); opacity: 0; }
}

.fx-streak::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 22%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(100deg,
    transparent,
    rgba(127, 242, 255, .35) 45%,
    rgba(0, 229, 255, .55) 50%,
    rgba(127, 242, 255, .35) 55%,
    transparent);
  transform: translateX(-160%) skewX(-18deg);
  animation: speedStreak .62s var(--engine-ease, ease-out) 1;
}

/* Snappier screen-in: rise + small overshoot, plays once. */
@keyframes screenInUp {
  0%   { transform: translateY(14px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

.fx-screen-in {
  animation: screenInUp .42s var(--engine-ease, ease-out) 1 both;
}

@media (prefers-reduced-motion: reduce) {
  .fx-streak::after { animation: none; opacity: 0; }
  .fx-screen-in { animation: none; }
}