.video-preview-host {
  position: relative;
  isolation: isolate;
}

.video-preview {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: #101010;
  pointer-events: none;
}

.video-preview[hidden],
.video-preview-play[hidden] {
  display: none;
}

.video-preview > img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}

.wb-lod-media > .video-preview > img {
  object-fit: cover;
}

.video-preview-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 48px;
  min-height: 48px;
  padding: 8px;
  border: 1px solid #fff8;
  border-radius: 50%;
  background: #171717d9;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  pointer-events: auto;
}

.reel-stage.video-preview-host > :is(.reel-shade, .reel-heading, .reel-controls, #reel-start, .reel-fallback) {
  z-index: 2;
}