.root {
  position: relative;
  overflow: hidden;
}

.wrapper {
  cursor: var(--custom-cursor, pointer);
  overflow: hidden;
  // Aspect-ratio trick https://css-tricks.com/aspect-ratio-boxes/
  height: 0;
  padding-bottom: 179%;
}

.media {
  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;
}

.mainIcon {
  font-size: 1.25rem;
  line-height: 0.9375rem;
  vertical-align: -0.1875rem;
}

.overlayIcon {
  position: absolute;
  z-index: 1;

  font-size: 0.75rem;
  line-height: 1;
  color: white;

  filter: drop-shadow(0 0 0.25rem black);
}

.pinnedIcon {
  top: 0.25rem;
  right: 0.25rem;
}

.viewsCount {
  bottom: 0.25rem;
  left: 0.25rem;

  display: flex;
  gap: 0.125rem;
  align-items: center;
}

.duration {
  right: 0.25rem;
  bottom: 0.25rem;
}

.contextMenu {
  position: relative;
  z-index: var(--z-right-column-menu);
}
