/* Single-use animation keyframes for SingleOpeningStage.tsx.
   Generated from styles/*-keyframes.ts per the tailwindcss writing guide. */
@keyframes singleCelebrate {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes singleStageIntro {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(16px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

@keyframes singleStageName {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes singleStageRoll {
  from {
    transform: translateX(calc(var(--tile) / -2));
  }
  to {
    transform: translateX(
      calc(var(--tile) / -2 - var(--target) * (var(--tile) + var(--gap)))
    );
  }
}

@keyframes singleStageWinner {
  0% {
    transform: scale(1);
  }
  35% {
    transform: scale(1.14);
    box-shadow: 0 0 0 8px
      color-mix(in srgb, var(--action-benefit) 12%, transparent);
  }
  100% {
    transform: scale(1.1);
    border-color: var(--action-benefit);
    background: var(--surface-solid);
    box-shadow: 0 8px 28px
      color-mix(in srgb, var(--action-benefit) 16%, transparent);
  }
}

@keyframes stageWinRing {
  0% {
    opacity: 0;
    transform: scale(0.9);
  }
  20% {
    opacity: 0.55;
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}

@keyframes studioFade {
  to {
    opacity: 0;
  }
}

@keyframes studioLift {
  0% {
    transform: scale(1);
  }
  65% {
    transform: scale(1.7) translateY(-9px);
    filter: drop-shadow(0 18px 12px #39275118);
  }
  100% {
    transform: scale(1.6);
    filter: drop-shadow(0 9px 6px #39275124);
  }
}

@keyframes studioUnframe {
  0% {
    border-color: var(--accent);
    transform: none;
    box-shadow: none;
  }
  100% {
    border-color: transparent;
    background: transparent;
    transform: none;
    box-shadow: none;
  }
}

/* Single-use animation keyframes for BoxPrizePool.tsx.
   Generated from styles/*-keyframes.ts per the tailwindcss writing guide. */
@keyframes box-prize-enter {
  from {
    opacity: 0;
    transform: translateY(0.35rem);
  }
}