.stage {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  background-color: #000;
  overflow: hidden;
}

.stage.is-empty {
  background-color: var(--color-bg);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.25 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-repeat: repeat;
}

.stage-video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background-color: #000;
  display: block;
}

.stage-video.is-zoomed {
  object-fit: cover;
}

.stage-empty {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
}