/* Feet are registered to the same baseline across the three drawings. */
.award-podium .award-character.victory-character {
  width: 100%;
  max-width: 100%;
  height: var(--award-figure-height);
  aspect-ratio: auto;
  isolation: isolate;
}
.victory-character::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -2px;
  left: 50%;
  translate: -50%;
  width: min(70%, calc(var(--award-figure-height) * .47));
  height: 5px;
  background: radial-gradient(ellipse, #3b2d1c55, transparent 75%);
}
.victory-frames { position: relative; display: block; width: 100%; height: 100%; transform-origin: 50% 100%; }
.victory-frames > span {
  position: absolute;
  left: 50%;
  bottom: 0;
  translate: -50%;
  width: min(100%, calc(var(--award-figure-height) * var(--pose-ratio) * var(--pose-scale, 1)));
  height: auto;
  aspect-ratio: var(--pose-ratio);
  display: block;
  background-repeat: no-repeat;
}
.victory-frames .pose-anticipation { background-image: url('./assets/awards-anticipation.png'); }
.victory-frames .pose-signature { background-image: url('./assets/awards-signature.png'); }
.victory-frames .victory-pose { opacity: 0; }
.award-podium .award-sprite { animation: none; }

/* The body language reads by rank, and the signature hand/leg drawing by character. */
.place-1 { --victory-move: victory-jump; --victory-beat: 2.8s; }
.place-2 { --victory-move: victory-two-step; --victory-beat: 3.2s; }
.place-3 { --victory-move: victory-bow; --victory-beat: 3.7s; }
.is-celebrating .victory-frames {
  animation: var(--victory-move) var(--victory-beat) ease-in-out var(--dance-delay) infinite;
}
.is-celebrating .victory-frames > span {
  animation: var(--pose-cycle) var(--victory-beat) steps(1, end) var(--dance-delay) infinite;
}
.victory-frames .award-sprite { --pose-cycle: victory-stand; }
.victory-frames .pose-anticipation { --pose-cycle: victory-ready; }
.victory-frames .pose-signature { --pose-cycle: victory-accent; }
@keyframes victory-stand { 0%, 90%, 100% { opacity: 1; } 16% { opacity: 0; } }
@keyframes victory-ready { 0%, 40%, 90%, 100% { opacity: 0; } 16%, 81% { opacity: 1; } }
@keyframes victory-accent { 0%, 81%, 100% { opacity: 0; } 40% { opacity: 1; } }
@keyframes victory-jump {
  0%, 15%, 70%, 100% { transform: none; }
  32% { transform: scale(1.04, .92); }
  48% { transform: translateY(-14%) rotate(-4deg); }
  58% { transform: translateY(0) scale(1.04, .95); }
}
@keyframes victory-two-step {
  0%, 100% { transform: none; }
  22% { transform: translateX(-3%) rotate(-5deg); }
  40% { transform: translate(1%, -3%) rotate(2deg); }
  55% { transform: translateX(3%) rotate(5deg); }
  76% { transform: translate(0, -2%) rotate(-2deg); }
}
@keyframes victory-bow {
  0%, 15%, 100% { transform: none; }
  31% { transform: skewX(-6deg) scaleY(.87); }
  44% { transform: rotate(4deg); }
  64% { transform: rotate(-2deg); }
  84% { transform: skewX(-2deg) scaleY(.97); }
}
