/*
 * NoirStream scene-preview layout and touch hardening.
 *
 * Core preview-layer positioning lives in styles.css so every public surface
 * gets it. Keep the mobile-specific replaced-element/grid hardening here.
 */
.video-card__media {
  display: block;
}

.performer-video-card__duration,
.watch-recommendation-card__duration {
  z-index: 3;
}

.watch-recommendation-card__media {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.watch-recommendation-card__media > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  display: block;
}

@media (hover: none), (pointer: coarse), (max-width: 980px) {
  .video-card__media,
  .video-card__media:hover {
    display: block;
    width: auto;
    max-width: none;
    contain: none !important;
    transform: none !important;
  }

  .video-card__media .video-card__image,
  .video-card__media:hover .video-card__image,
  .video-card__media.ns-previewing .video-card__image,
  .performer-video-card__media:hover img,
  .watch-recommendation-card__media:hover img,
  .ns-scene-preview-frame {
    transform: none !important;
  }
}
