/* One photographic composition, with native scrolling and a static fallback. */
.fight-night-welcome {
  --welcome-viewport: 100vh;
  --welcome-height: min(760px, calc(var(--welcome-viewport) - var(--anchor-clearance, 124px) - var(--action-clearance, 0px)));
  --welcome-travel: min(220px, calc(var(--welcome-viewport) * .24));
  position: relative;
  width: 100%;
  background: #000;
}
@supports (height: 100svh) { .fight-night-welcome { --welcome-viewport: 100svh; } }
.welcome-scene-stage {
  height: var(--welcome-height);
  display: grid;
  place-items: center;
  background: #000;
}
.welcome-artwork {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transform-origin: center;
  transform: scale(var(--welcome-scale, 1));
  border-radius: var(--welcome-radius, 0px);
  opacity: var(--welcome-opacity, 1);
}
.welcome-artwork img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 900px) and (orientation: portrait) {
  .fight-night-welcome { --welcome-height: min(760px, calc(100vw * 4 / 3), calc(var(--welcome-viewport) - var(--anchor-clearance, 104px) - var(--action-clearance, 81px))); --welcome-travel: min(140px, calc(var(--welcome-viewport) * .18)); }
}
@media (prefers-reduced-motion: no-preference) { @supports (position: sticky) {
  .welcome-motion { height: calc(var(--welcome-height) + var(--welcome-travel)); }
  .welcome-motion .welcome-scene-stage { position: sticky; top: calc(var(--anchor-clearance, 124px) - 24px); }
} }