.mascot-lockup { align-self: end; }
.mascot-stage { aspect-ratio: 640 / 760; position: relative; width: 100%; }
.mascot-lockup .mascot-poster { aspect-ratio: 640 / 760; height: 100%; margin: 0; position: absolute; inset: 0; width: 100%; }
.mascot-stage canvas { display: block; position: absolute; inset: 0; height: 100%; width: 100%; cursor: grab; touch-action: pan-y; }
.mascot-stage canvas:active { cursor: grabbing; }
.mascot-stage canvas:focus-visible { outline: 2px solid var(--burgundy); outline-offset: 3px; }
.mascot-stage.is-ready .mascot-poster { visibility: hidden; }
.mascot-spin { align-items: center; background: transparent; border: 0; color: var(--burgundy); cursor: pointer; display: flex; font: 700 10px 'DM Sans', Arial, sans-serif; gap: 8px; justify-content: center; letter-spacing: .07em; margin: -5px auto 12px; min-height: 44px; padding: 8px 12px; text-transform: uppercase; }
.mascot-spin span { font-size: 20px; line-height: 1; }
.mascot-spin:hover { text-decoration: underline; text-underline-offset: 4px; }
.mascot-spin[aria-pressed="true"] { background: var(--burgundy); color: var(--offwhite); }
.house-rules .club-badge { display: block; width: min(100%, 210px); height: auto; margin: 10px auto 32px; }
@media (max-width: 700px) {
  .mascot-lockup { align-self: center; text-align: center; }
  .mascot-spin { font-size: 9px; gap: 4px; margin: 0 auto 4px; padding: 4px; width: 100%; }
  .mascot-lockup .crest-caption { font-size: 8px; letter-spacing: .035em; }
}