/*
 * The current sheet is 1536 × 1024, not the original reference's dimensions.
 * Each viewport covers 480 × 518 source pixels. The lower row begins at y=518,
 * in the transparent gap after the upper-row shoes (which extend to y=514).
 * Extending that viewport past the sheet's bottom adds transparent breathing
 * room and keeps the cheer pose's entire shoe, ending at y=1006, visible.
 * Existing responsive widths and transform animations stay in control.
 */
.mascot {
  --sprite-x: 1.515151515%;
  --sprite-y: 0%;
  aspect-ratio: 480 / 518;
  background-size: 320% 197.683397683%;
  background-position: var(--sprite-x) var(--sprite-y);
  background-repeat: no-repeat;
}

.mascot[data-pose="defend"] {
  --sprite-x: 1.515151515%;
  --sprite-y: 0%;
}

.mascot[data-pose="ready"] {
  --sprite-x: 50%;
  --sprite-y: 0%;
}

.mascot[data-pose="shoot"] {
  --sprite-x: 98.484848485%;
  --sprite-y: 0%;
}

.mascot[data-pose="cheer"] {
  --sprite-x: 1.515151515%;
  --sprite-y: 102.371541502%;
}

.mascot[data-pose="shy"] {
  --sprite-x: 50%;
  --sprite-y: 102.371541502%;
}

.mascot[data-pose="run"] {
  --sprite-x: 98.484848485%;
  --sprite-y: 102.371541502%;
}

/* Keep the card's portrait anchored inside its intentional crop window. */
.card-portrait .mascot {
  bottom: 0;
}