.shot-block {
  width: 100%;
  max-width: 100%;
  margin: 1.15rem 0 0.35rem;
  min-width: 0;
}

.xo-app .shot-block {
  width: min(calc(100% - 2.5rem), 72rem);
  margin: 0.2rem auto 1.35rem;
}

.shot-rail {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 3px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0 0 8px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: #6a6a6a transparent;
}

.shot-rail img {
  flex: 0 0 auto;
  width: auto;
  height: min(52vh, 420px);
  max-width: none;
  object-fit: contain;
  object-position: center top;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  scroll-snap-align: start;
}

@media (min-width: 768px) {
  .shot-rail img {
    height: min(50vh, 460px);
  }
}

@media (min-width: 1100px) {
  .shot-rail img {
    height: min(58vh, 520px);
  }
}

.shot-rail:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}
