/* Original screenshots: contain the complete interface, never crop or stretch. */
body.public-site .image-carousel.has-screenshots {
  padding-bottom: 60px;
}

body.public-site .has-screenshots .carousel-slide {
  min-height: 0;
  min-width: 0;
}

body.public-site .has-screenshots .carousel-image-slot.carousel-image-real {
  display: flex;
  align-items: center;
  min-height: 0;
  min-width: 0;
  padding: 0;
  background: #171717;
}

body.public-site .has-screenshots .carousel-image-real::before {
  content: none;
}

body.public-site .has-screenshots .carousel-image-real img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* Navigation stays outside the screenshots so no interface detail is covered. */
body.public-site .has-screenshots .carousel-control {
  top: auto;
  bottom: 10px;
  transform: none;
}

body.public-site .has-screenshots .carousel-prev {
  left: calc(50% - 102px);
}

body.public-site .has-screenshots .carousel-next {
  right: calc(50% - 102px);
}

body.public-site .has-screenshots .carousel-dots {
  right: auto;
  left: 50%;
  bottom: 26px;
  transform: translateX(-50%);
}

@media (max-width: 520px) {
  body.public-site .has-screenshots .carousel-control {
    bottom: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.public-site .has-screenshots .carousel-track {
    transition: none;
  }
}
