/* Build 328 UI screenshots layered onto the original MUTE LP design. */
.real-device-shot,
.cute-ui-slide {
  overflow: hidden !important;
  border-radius: 6% / 2.6% !important;
  background: #111;
  box-shadow:
    0 24px 52px rgba(35, 16, 29, .34),
    0 0 0 1px rgba(255, 255, 255, .16);
}

.real-device-shot > img,
.cute-ui-slide > img,
.passcode-img.real-device-shot {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 6% / 2.6% !important;
  transform: none !important;
  object-fit: contain !important;
}

/* The duplicated sets form one continuous horizontal preview loop. */
#honmaru-preview .preview-scroll.preview-loop {
  display: block;
  overflow: hidden;
}

#honmaru-preview .preview-loop-track,
#honmaru-preview .preview-loop-set {
  display: flex;
  align-items: flex-start;
  width: max-content;
}

#honmaru-preview .preview-loop-set {
  gap: clamp(18px, 3vw, 34px);
  padding-right: clamp(18px, 3vw, 34px);
}

#honmaru-preview .preview-loop-set .preview-phone {
  flex: 0 0 clamp(180px, 15.3vw, 220px);
  width: clamp(180px, 15.3vw, 220px);
}

@media (max-width: 520px) {
  #honmaru-preview .preview-loop-set {
    gap: 16px;
    padding-right: 16px;
  }

  #honmaru-preview .preview-loop-set .preview-phone {
    flex-basis: 43vw;
    width: 43vw;
  }
}
