.video-player {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  background: var(--player-bg);
  border-radius: var(--player-radius);
  overflow: hidden;
  color: var(--player-text);
  font-family: var(--player-font-family, 'Inter', 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  user-select: none;
  -webkit-user-select: none;
  isolation: isolate;
  transition: border-radius var(--player-transition-normal) ease;
}

.video-player *,
.video-player *::before,
.video-player *::after {
  box-sizing: border-box;
}

.video-player::before {
  content: '';
  display: block;
  padding-top: var(--player-aspect-ratio, 56.25%);
}

.video-player > * {
  position: absolute;
  inset: 0;
}

.video-player video {
  display: block;
  width: 100%;
  height: 100%;
}

.video-player:fullscreen,
.video-player:-webkit-full-screen,
.video-player:-moz-full-screen,
.video-player:-ms-fullscreen,
:fullscreen .video-player,
:-webkit-full-screen .video-player {
  border-radius: 0;
}

.video-player video::-webkit-media-controls,
.video-player video::-webkit-media-controls-enclosure,
.video-player video::-webkit-media-controls-panel {
  display: none !important;
}

.video-player video::-webkit-media-text-track-container,
.video-player video::-webkit-media-text-track-display {
  display: block !important;
}