.recommended-carousel--static .recommended-carousel__viewport {
  overflow: hidden;
  cursor: default;
}

.recommended-carousel--static .recommended-carousel__track {
  display: block;
  width: 100%;
}

.recommended-carousel--static .recommended-carousel__set {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.75rem), 1fr));
  padding-right: 0;
}

.recommended-carousel--static .game-card {
  flex: 1 1 auto;
  width: auto;
}

.recommended-carousel__viewport {
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.recommended-carousel--scrollable .recommended-carousel__viewport {
  cursor: grab;
}

.recommended-carousel--scrollable .recommended-carousel__viewport.is-dragging {
  cursor: grabbing;
}

.recommended-carousel--scrollable .game-card {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.recents-skeleton--scrollable {
  overflow: hidden;
}

.recents-skeleton:not(.recents-skeleton--scrollable) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.75rem), 1fr));
}

.recents-skeleton:not(.recents-skeleton--scrollable) .recents-skeleton__card {
  flex: 1 1 auto;
  width: auto;
}

@media (max-width: 767px) {
  .recommended-carousel--scrollable .game-card,
  .recents-skeleton--scrollable .recents-skeleton__card {
    flex: 0 0 calc((100vw - 3.75rem) / 2.5);
    width: calc((100vw - 3.75rem) / 2.5);
  }
}