:root {
  --videoosd-tabs-height: 20em;
}
@supports selector(:hover) and (--videoosd-tabs-height: clamp(10vh, 20em, 60vh)) {
  :root {
    --videoosd-tabs-height: clamp(10vh, 20em, 60vh);
  }
}
.layout-tv:root {
  --videoosd-tabs-height: 38vh;
}
.videoOsdHeader {
  will-change: opacity;
  transition: opacity 0.4s ease-out;
  text-shadow: none !important;
}
.videoOsdHeader:not(.videoosd-header-safe) {
  padding-left: 0;
  padding-right: 0;
}
.videoOsdHeader-locked {
  display: none !important;
}
.videoOsdHeader-hidden {
  opacity: 0;
}
.videoOsdHeader .headerButton:not(.headerBackButton):not(.headerCastButton) {
  display: none;
}
.chapterThumbImageContainer {
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 24vw;
  height: 13.5vw;
  width: clamp(20vmax, 22em, 35vmin);
  height: calc(clamp(20vmax, 22em, 35vmin) * 9 / 16);
  aspect-ratio: 16/9;
  background-color: #000;
  box-shadow:
    0 4px 5px 0 rgba(0, 0, 0, 0.14),
    0 1px 10px 0 rgba(0, 0, 0, 0.12),
    0 2px 4px -1px rgba(0, 0, 0, 0.4) !important;
  margin-top: -2em;
}
.chapterThumbImageContainer-fourthree {
  height: calc(clamp(20vmax, 22em, 35vmin) * 3 / 4);
  aspect-ratio: 4/3;
}
.chapterThumbTextContainer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  text-shadow: #000 0 0 0.5em;
  font-weight: 500;
  padding-bottom: 0.25em;
  text-align: center;
}
.chapterThumbTextContainer-noimg {
  position: static;
  padding: 0.5em 0;
}
.chapterThumbText {
  padding: 0 1em;
  margin: 0;
}
@supports (aspect-ratio: 16 / 9) {
  .chapterThumbImageContainer {
    width: clamp(20vmax, 22em, 35vmin);
    height: auto !important;
  }
}
.chapterThumbImageContainer-tv {
  width: 29vw;
  height: 16.3125vw;
}
.chapterThumbImageContainer-tv.chapterThumbImageContainer-fourthree {
  width: 24vw;
  height: 18vw;
  aspect-ratio: 4/3;
}
.chapterThumbImageContainer-noimg {
  width: auto;
  height: auto;
  min-width: min(10vw, 8em);
  max-width: min(30vw, 30em);
}
.videoOsdBottom {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  padding: 1.25em 3%;
  padding-top: 1.25em;
  padding-bottom: min(1.25em, 1vh);
  padding-left: min(5ch, 2%);
  padding-right: min(5ch, 2%);
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}
@supports (height: calc(3.125em + 2 * max(3em, 4em))) {
  .videoOsdBottom-safe {
    padding-left: calc(min(5ch, 2%) + env(safe-area-inset-left, 0));
    padding-right: calc(min(5ch, 2%) + env(safe-area-inset-right, 0));
  }
}
.videoOsdBottom-safe {
  position: static;
  overflow: hidden;
  padding-bottom: min(1.75em, 1.75vh);
  -webkit-flex-grow: 1;
  flex-grow: 1;
}
@supports (height: calc(3.125em + 2 * max(3em, 4em))) {
  .videoOsdBottom-safe {
    padding-bottom: calc(min(1.75em, 1.75vh) + env(safe-area-inset-bottom, 0));
  }
}
.videoOsdBottom-maincontrols {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
  max-height: 100%;
  position: relative;
  padding: 0 1.2em;
  -webkit-align-content: flex-end;
  align-content: flex-end;
}
.videoOsdPositionContainer,
.videoosd-tabcontainers,
.videoOsdBottom-contentbuttons,
.videoOsdBottom-buttons {
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
}
.videoOsdBottom-contentbuttons {
  -webkit-order: 4;
  order: 4;
}
.videoosd-bottom-with-opentab {
  padding-bottom: min(2em, 1.25vh);
  will-change: initial !important;
}
@supports (height: calc(3.125em + 2 * max(3em, 4em))) {
  .videoosd-bottom-with-opentab.videoOsdBottom-safe {
    padding-bottom: calc(min(2em, 1.25vh) + env(safe-area-inset-bottom, 0));
  }
}
.videoOsdBottom-video {
  will-change: opacity;
  transition: opacity 0.4s ease-out;
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
}
.osdPosterContainer {
  max-height: 100%;
  max-height: calc(100% - 19em);
  overflow: hidden;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
}
.osdPosterContainer.itemsContainer-tv {
  max-height: calc(100% - 12em);
}
.osdRemoteControlImageCard {
  width: 100%;
  max-width: 30vh;
  margin: 0 auto;
}
.osdRemoteControlImageCardBox {
  margin: 0.2em !important;
}
.osdRemoteControlImageCardContent {
  border-radius: 0.6em !important;
  box-shadow:
    0 0.06933em 0.06933em 0 rgba(0, 0, 0, 0.14),
    0 0.13866em 0.06933em -0.06933em rgba(0, 0, 0, 0.12),
    0 0.06933em 0.208em 0 rgba(0, 0, 0, 0.2) !important;
}
@supports (aspect-ratio: 1) {
  .osdRemoteControlImageCard {
    width: auto !important;
    max-width: 100%;
    padding-bottom: 0 !important;
    aspect-ratio: 1;
    overflow: hidden;
    height: 90vw;
    max-height: 100%;
  }
  .osdRemoteControlImageCard.backdropCard {
    aspect-ratio: 16/9;
    height: calc(90vw * (9 / 16));
  }
  .osdRemoteControlImageCard.fourThreeCard {
    aspect-ratio: 4/3;
    height: calc(90vw * (3 / 4));
  }
  .osdRemoteControlImageCard.portraitCard {
    aspect-ratio: 2/3;
    height: calc(90vw * (3 / 2));
  }
}
.osdContentSection-split {
  -webkit-flex-grow: 1;
  flex-grow: 1;
  overflow: hidden;
}
@media all and (orientation: landscape) {
  @supports (aspect-ratio: 1) {
    .osdRemoteControlImageCard {
      height: 35vw;
    }
    .osdRemoteControlImageCard.backdropCard {
      height: calc(35vw * (9 / 16));
    }
    .osdRemoteControlImageCard.fourThreeCard {
      height: calc(35vw * (3 / 4));
    }
    .osdRemoteControlImageCard.portraitCard {
      height: calc(35vw * (3 / 2));
    }
  }
  .osdContentSection-split {
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    width: 55%;
    width: min(60%, 75em);
    max-height: 95%;
    box-sizing: border-box;
    -webkit-padding-start: 4ch;
    padding-inline-start: 4ch;
  }
}
@media all and (min-width: 140em) {
  .osdContentSection-split {
    -webkit-padding-start: 0 !important;
    padding-inline-start: 0 !important;
  }
}
.osdContentSection-tv-split {
  -webkit-padding-start: 3ch !important;
  padding-inline-start: 3ch !important;
  -webkit-padding-start: 3ch !important;
  padding-inline-start: 3ch !important;
  position: absolute;
  top: 5em;
  bottom: 8em;
  right: 0;
  inset-inline-start: initial;
  inset-inline-end: 0;
  width: 67%;
  z-index: 1;
}
.videoOsdText {
  -webkit-flex-direction: column-reverse;
  flex-direction: column-reverse;
  margin-bottom: 0.75em;
  -webkit-flex-basis: 50%;
  flex-basis: 50%;
  -webkit-order: 0;
  order: 0;
}
.videoOsdPositionContainer {
  box-sizing: border-box;
  font-weight: 500;
  -webkit-order: 2;
  order: 2;
}
.videoOsdPositionContainer-autosmall {
  margin-top: 0.5em;
}
.videoOsdPositionContainer-vertical {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.videoOsdPositionSliderContainer {
  -webkit-order: 1;
  order: 1;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
  margin: 0.1em 0 0.3em !important;
}
.videoOsdPositionText {
  -webkit-order: 2;
  order: 2;
  -webkit-flex-basis: 35%;
  flex-basis: 35%;
}
.videoOsd-audioInfo {
  -webkit-order: 3;
  order: 3;
  -webkit-flex-basis: 30%;
  flex-basis: 30%;
  -webkit-justify-content: center;
  justify-content: center;
  font-size: 92%;
}
.videoOsdDurationText {
  -webkit-order: 4;
  order: 4;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  -webkit-flex-basis: 35%;
  flex-basis: 35%;
  -webkit-flex-grow: 1;
  flex-grow: 1;
}
.videoOsdPositionText:not(.videoOsd-customFont-x0) {
  font-size: 92%;
}
.videoOsdDurationText:not(.videoOsd-customFont-x0) {
  font-size: 92%;
}
.osd-endsat {
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-align-items: center;
  align-items: center;
}
.osd-endsat-dot {
  margin: 0 1ch;
  font-size: 84%;
}
@media not all and (min-width: 28em) {
  .osd-endsat {
    display: none !important;
  }
}
.videoOsdText-remotecontrol {
  margin: 1.05em 0 0.75em;
  padding: 0;
  -webkit-flex-direction: column;
  flex-direction: column;
  text-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
}
.videoOsdText-remotecontrol-tv {
  margin: 0.25em 0 0;
}
.videoOsdText-remotecontrol-tv h3 {
  font-size: inherit;
}
.videoOsdBottom-tvnowplaying.videoOsdBottom-split .osdPosterContainer,
.videoOsdBottom-tvnowplaying.videoOsdBottom-split .videoOsdText {
  -webkit-margin-start: -30vw;
  margin-inline-start: -30vw;
}
@media not all and (orientation: landscape) {
  .osdPosterContainer {
    max-height: 60%;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    overflow: hidden;
    -webkit-justify-content: center;
    justify-content: center;
  }
  .videoOsdBottom-safe.videoOsdBottom-split .osdPosterContainer,
  .videoOsdBottom-safe.videoOsdBottom-split .videoOsdText-remotecontrol {
    display: none !important;
  }
  .videoOsdBottom-maincontrols {
    -webkit-align-content: flex-end;
    align-content: flex-end;
  }
  .videoOsdBottom-safe.videoOsdBottom-split .videoOsdBottom-maincontrols {
    padding-top: 0.75em;
  }
}
@media all and (min-width: 50em) {
  .videoOsd-customFont-x2 {
    font-size: 1.1em;
  }
}
@media all and (orientation: landscape) {
  .videoOsdBottomMaincontrols-autoexpand {
    -webkit-flex-shrink: initial;
    flex-shrink: initial;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-align-content: flex-start;
    align-content: flex-start;
  }
}
.videoOsdSecondaryText {
  -webkit-align-items: baseline;
  align-items: baseline;
}
.videoOsdSecondaryText-withparentname {
  margin-bottom: 0.25em;
  font-weight: 500;
}
.videoOsdSecondaryText-tv {
  margin-bottom: 0.25em;
}
.videoOsdSecondaryText-remotecontrol {
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-direction: column;
  flex-direction: column;
  margin-bottom: 0;
}
.videoOsdSecondaryMediaInfo-remotecontrol {
  font-size: 92%;
  font-weight: 500;
  margin-top: 1em;
  margin-bottom: 0;
  -webkit-margin-start: 0;
  margin-inline-start: 0;
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}
.osdTextActionButton {
  color: inherit !important;
  font-weight: inherit !important;
}
.videoOsdTitle,
.videoOsdParentTitle,
.videoOsdThirdTitle {
  font-weight: 600;
}
.videoOsdThirdTitle {
  margin: 0;
}
.videoOsdBottom-hidden:not(.videoOsdBottom-tvnowplaying) {
  opacity: 0;
}
@-webkit-keyframes osd-animate-text {
  0% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: initial;
  }
}
@keyframes osd-animate-text {
  0% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0;
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: initial;
  }
}
.videoOsdBottom-tvnowplaying:not(.videoOsdBottom-art) .osdPosterContainer,
.videoOsdBottom-tvnowplaying:not(.videoOsdBottom-art) .videoOsdText,
.videoOsdBottom-tvnowplaying:not(.videoOsdBottom-art)
  .osdContentSection:not(.osdPlayQueue) {
  display: none !important;
}
.osdIconButton-icon,
.osdContentSectionToggleButtonIcon {
  padding: 0.08em !important;
}
.osdIconButton,
.osdContentSectionToggleButton {
  padding: 0.5em !important;
}
.videoOsd-nobuttonmargin .osdIconButton,
.videoOsd-nobuttonmargin .osdContentSectionToggleButton {
  margin: 0 0.3ch;
}
.videoOsdBottom-buttons {
  -webkit-margin-start: -1em;
  margin-inline-start: -1em;
  -webkit-order: 3;
  order: 3;
}
.videoOsdBottom-buttons-remotecontrol {
  margin: 0;
  -webkit-flex-direction: row;
  flex-direction: row;
  padding: 0;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.videoOsdBottom-buttons-remotecontrol-tv {
  -webkit-flex-basis: 50%;
  flex-basis: 50%;
  -webkit-flex-grow: 1;
  flex-grow: 1;
}
.videoOsdBottom-buttons-topright {
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  -webkit-margin-end: -0.75em;
  margin-inline-end: -0.75em;
  -webkit-flex-basis: content;
  flex-basis: content;
  -webkit-order: 1;
  order: 1;
  -webkit-align-items: flex-end;
  align-items: flex-end;
  margin-bottom: 0.25em;
}
.videoOsdBottom-buttons-topright-remotecontrol {
  -webkit-justify-content: center;
  justify-content: center;
  width: 100%;
  -webkit-margin-start: initial;
  margin-inline-start: initial;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
  margin: 0;
  -webkit-order: 4;
  order: 4;
}
.videoOsdBottom-buttons-topright-remotecontrol-tv {
  margin-bottom: 0.5em;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
}
.osdVolumeDisplayIcon-left {
  -webkit-margin-end: 0.25em;
  margin-inline-end: 0.25em;
  -webkit-margin-start: 1.6em;
  margin-inline-start: 1.6em;
}
.osdVolumeDisplayIcon-right {
  -webkit-margin-start: 0.25em;
  margin-inline-start: 0.25em;
  -webkit-margin-end: 1.6em;
  margin-inline-end: 1.6em;
}
.btnMuteOSD-remotecontrol {
  -webkit-margin-start: 0 !important;
  margin-inline-start: 0 !important;
  display: none;
}
.videoOsdVolumeControls {
  -webkit-justify-content: center;
  justify-content: center;
}
.videoOsdVolumeControls:not(.videoOsdVolumeControls-showhover) {
  -webkit-order: 2;
  order: 2;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
  padding: 0;
}
@media all and (min-height: 38em) {
  .videoOsdVolumeControls:not(.videoOsdVolumeControls-showhover) {
    padding: 0.25em 0;
  }
}
@media all and (min-height: 50em) {
  .videoOsdVolumeControls:not(.videoOsdVolumeControls-showhover) {
    padding: 0.5em 0;
  }
}
.videoOsdPositionSlider {
  margin: -1.605em 0;
}
.videoOsdPositionContainer-limitwidth {
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  -webkit-margin-end: auto;
  margin-inline-end: auto;
  width: 100%;
  box-sizing: border-box;
  max-width: 50em;
}
.videoOsdVolumeSliderWrapper {
  max-width: 44em;
}
.videoOsdVolumeControls-showhover > .videoOsdVolumeSliderWrapper {
  position: absolute;
  top: -2.75em;
  left: -3.5em;
  inset-inline-start: -3.5em;
  inset-inline-end: initial;
  display: none;
  width: 8.5em;
  z-index: 99999999;
  background: #262626;
  padding: 1.25em 1.25em;
  border-radius: 0.3em;
  max-width: initial;
}
.videoOsdVolumeControls-showhover:hover > .videoOsdVolumeSliderWrapper {
  display: -webkit-flex;
  display: flex;
}
.videoOsdVolumeControls-showhover > .osdVolumeDisplayIcon {
  display: none;
}
@media not all and (pointer: fine) {
  .videoOsdVolumeControls-hidetouch {
    display: none !important;
  }
}
@media not all and (min-width: 50em) {
  .videoOsdVolumeControls-hidetouch {
    display: none !important;
  }
}
.volumeButtons {
  margin-top: 0;
  margin-bottom: 0;
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  -webkit-margin-end: 0.5em;
  margin-inline-end: 0.5em;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}
.videoOsdParentTitle {
  margin: 0;
}
.videoOsdTitle {
  margin-top: 0;
  margin-bottom: 0;
  -webkit-margin-start: 0;
  margin-inline-start: 0;
  -webkit-margin-end: 1em;
  margin-inline-end: 1em;
}
.videoOsdSecondaryText-remotecontrol .videoOsdTitle {
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}
.osdTitle-remotecontrol {
  margin: 0;
}
@media not all and (pointer: fine) {
  .videoOsd-centerButtons-autolayout {
    position: fixed;
    top: 45%;
    left: 0;
    right: 0;
    inset-inline-start: 0;
    inset-inline-end: 0;
    -webkit-justify-content: center;
    justify-content: center;
    display: -webkit-flex;
    display: flex;
    -webkit-align-self: center;
    align-self: center;
    margin-top: -2em;
    font-size: 130%;
    font-size: 3.5vmax;
  }
  @media all and (orientation: portrait) {
    .videoOsd-centerButtons-autolayout {
      top: 50%;
    }
  }
  .videoOsd-btnPause-autolayout {
    -webkit-margin-start: 10%;
    margin-inline-start: 10%;
    -webkit-margin-end: 10%;
    margin-inline-end: 10%;
  }
}
.videoOsd-forwardIcon-flipped {
  -webkit-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.btnOsdRewindIcon,
.btnOsdFastForwardIcon {
  will-change: animate;
}
.videoOsdParentTitleContainer {
  position: relative;
}
.btnOsdMore-title {
  margin-top: 0;
  margin-bottom: 0;
  -webkit-margin-start: 0.5em;
  margin-inline-start: 0.5em;
  -webkit-margin-end: 0;
  margin-inline-end: 0;
  padding: 0.16em;
  position: absolute;
  right: -2.5em;
  inset-inline-start: initial;
  inset-inline-end: -2.5em;
}
@media all and (pointer: fine) {
  .btnOsdMore-title {
    display: none !important;
  }
}
@media not all and (pointer: fine) {
  .btnOsdMore-bottom-autohide {
    display: none !important;
  }
}
.videoosd-tabsslider {
  -webkit-column-gap: 0.25ch;
  column-gap: 0.25ch;
  -webkit-align-items: center;
  align-items: center;
  padding: 0  0.5em;
}
.videoosd-tab-button {
  padding: 0.25em 1em !important;
  border-radius: 100em;
  -webkit-margin-end: 2em;
  margin-inline-end: 2em;
  overflow: visible;
}
.videoosd-tab-button:hover {
  background: hsla(
    var(--theme-text-color-hue),
    var(--theme-text-color-saturation),
    var(--theme-text-color-lightness),
    0.2);
}
.videoosd-tab-button:active {
  color: var(--theme-accent-text-color);
}
.videoosd-tab-button::before {
  left: -1em !important;
  right: -1em !important;
}
.videoosd-tab-button.emby-tab-button-active::before {
  position: absolute;
  top: 0;
  left: -1em;
  right: -1em;
  bottom: 0;
  content: " ";
  z-index: -1;
  border-radius: inherit;
}
.videoosd-tabcontainers {
  height: 38vh;
  height: var(--videoosd-tabs-height);
  transition: height 0.4s ease-out;
  overflow: hidden;
  border-radius: 0.6em;
  contain: strict;
  margin: 0 -1em;
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
  -webkit-order: 6;
  order: 6;
}
.videoOsdBottom-tabs {
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-order: 5;
  order: 5;
}
.videoOsdBottom-tabs-remotecontrol {
  -webkit-justify-content: center;
  justify-content: center;
  margin-top: 1em;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
}
.videoOsdTabs-margintop .videoosd-tabsslider {
  margin-top: 0.5em;
}
.videoosd-tabcontainers-hidden {
  height: 0;
}
.videoosd-tab {
  overflow: hidden;
}
.videoosd-tab:not(.videoosd-activetab) {
  display: none;
}
.videoosd-tabsslider:focus-within .emby-tab-button-active:not(:focus) {
  background: 0 0;
  color: inherit;
}
.videoosd-tabsslider:focus-within .emby-tab-button-active:not(:focus)::before {
  background: 0 0;
}
.videoosd-bottom-with-opentab .videoOsd-hideWithOpenTab {
  display: none !important;
}
.videoosd-bottom-locked .videoOsd-hideWhenLocked {
  display: none !important;
}
@media not all and (min-height: 24em), not all and (min-width: 28em) {
  .videoOsdBottom-tabs,
  .videoosd-tabcontainers {
    display: none !important;
  }
}
.videoosd-tabBackground {
  background: rgba(60, 60, 60, 0.8);
}
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter: blur(1em)) {
  .videoosd-tabBackground-backdropfilter {
    background: rgba(56, 56, 56, 0.76);
    -webkit-backdrop-filter: saturate(1.8) blur(4em);
    backdrop-filter: saturate(1.8) blur(4em);
  }
}
.btnCloseTabContent {
  margin: 0 !important;
  position: relative;
  top: -0.15em;
  padding: 0.25em !important;
  background-color: black;
  color: var(--theme-accent-text-color-darkbg);
}
.btnCloseTabContent.icon-button-focusscale {
  padding: 0 !important;
}
.videoosd-poster {
  width: 9em;
  width: calc((var(--videoosd-tabs-height) - 2em) * (2 / 3));
  max-width: 20vw;
  overflow: hidden;
  -webkit-margin-end: 1.25em;
  margin-inline-end: 1.25em;
}
.osdInfoImageCard {
  width: 100% !important;
}
.osdInfoImageCardBox {
  margin: 0 !important;
}
.videoosd-info {
  overflow: hidden;
}
.videoosd-info-overview {
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 0.25em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}
@supports selector(:hover) and (display: revert) and (column-gap: 1em) {
  .videoosd-info-mediainfoContainer {
    -webkit-column-gap: 1em;
    column-gap: 1em;
  }
}
.videoOsd-itemstab-card.squareCard {
  width: 20vw;
  max-width: 34vw;
}
.videoOsd-itemstab-card.fourThreeCard {
  width: 12vw;
  max-width: 44vw;
}
.videoOsd-itemstab-card.backdropCard {
  width: 19vw;
  max-width: 44vw;
}
.videoOsd-itemstab-card.portraitCard {
  width: 8vw;
  max-width: 30vw;
}
.videoOsd-itemstab-card-twoline.backdropCard {
  width: calc((var(--videoosd-tabs-height) - 3.75em) * (16 / 9));
}
.videoOsd-itemstab-card-twoline.fourThreeCard {
  width: calc((var(--videoosd-tabs-height) - 3.5em) * (4 / 3));
}
.videoOsd-itemstab-card-twoline.portraitCard {
  width: calc((var(--videoosd-tabs-height) - 2.25em) * (2 / 3));
}
.videoOsd-itemstab-card-twoline.squareCard {
  width: calc((var(--videoosd-tabs-height) - 3em));
}
.videoOsd-itemstab-card-threeline.backdropCard {
  width: calc((var(--videoosd-tabs-height) - 5.75em) * (16 / 9));
}
.videoOsd-itemstab-card-threeline.fourThreeCard {
  width: calc((var(--videoosd-tabs-height) - 4.75em) * (4 / 3));
}
.videoOsd-itemstab-card-threeline.portraitCard {
  width: calc((var(--videoosd-tabs-height) - 3.75em) * (2 / 3));
}
.videoOsd-itemstab-card-threeline.squareCard {
  width: calc((var(--videoosd-tabs-height) - 4.25em));
}
.videoOsd-cardImageContainer-sideFooter {
  width: 4.4em;
  height: 4.4em;
}
.videoOsd-itemstab-card .cardText {
  font-weight: 500;
  font-size: 92%;
}
.videoosd-itemstab .scrollbuttoncontainer {
  background: 0 0 !important;
  overflow: visible;
}
.videoosd-itemstab .emby-scrollbuttons-scrollbutton {
  background: #fff !important;
  color: #000 !important;
  border-radius: 100em;
  padding: 0.2em;
  box-shadow:
    0 4px 5px 0 rgba(0, 0, 0, 0.14),
    0 1px 10px 0 rgba(0, 0, 0, 0.12),
    0 2px 4px -1px rgba(0, 0, 0, 0.4) !important;
  margin: 0 0.5em;
}
.videoosd-itemstab
  .scrollbuttoncontainer:hover
  > .emby-scrollbuttons-scrollbutton {
  -webkit-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
}
.videoosd-guidetab .guideSettingsContainer,
.videoosd-guidetab .btnGuideViewSettings {
  display: none !important;
}
.videoosd-guidetab .programCellInner {
  background: rgba(0, 0, 0, 0.5);
}
.videoosd-guidetab .channelCellInner {
  background: #242424;
}
.videoosd-guidetab .firstChannelCell-withscroll {
  background: #242424 !important;
}
.videoosd-padded-left {
  -webkit-padding-start: 3.8%;
  padding-inline-start: 3.8%;
  -webkit-padding-start: min(3.8%, 3.6em);
  padding-inline-start: min(3.8%, 3.6em);
}
.videoosd-padded-right {
  -webkit-padding-end: 3.8%;
  padding-inline-end: 3.8%;
  -webkit-padding-end: min(3.8%, 3.6em);
  padding-inline-end: min(3.8%, 3.6em);
}
@media all and (max-height: 30em) and (orientation: landscape) {
  .videoOsdPositionContainer-autosmall,
  .videoosd-tabcontainers-autosmall,
  .videoOsdBottom-contentbuttons,
  .videoOsdBottom-buttons-remotecontrol {
    margin: 0 auto;
  }
  .videoOsdText-autosmall {
    margin: 0 !important;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    -webkit-flex-basis: 55% !important;
    flex-basis: 55% !important;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-justify-content: center;
    justify-content: center;
    max-height: 40%;
    text-align: start;
  }
  .osdPosterContainer-autoexpand {
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    margin: 0 auto;
    -webkit-flex-basis: 45% !important;
    flex-basis: 45% !important;
    max-height: 40% !important;
  }
  .osdTextActionButton {
    text-align: start;
  }
  .osdRemoteControlImageCard-automargin {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    -webkit-margin-start: auto !important;
    margin-inline-start: auto !important;
    -webkit-margin-end: 1em !important;
    margin-inline-end: 1em !important;
  }
  .videoOsdSecondaryText-remotecontrol {
    -webkit-align-items: initial;
    align-items: initial;
  }
}
.videoOsdBottom-contentbuttons-tv {
  -webkit-flex-basis: 50%;
  flex-basis: 50%;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  -webkit-margin-end: -0.75em;
  margin-inline-end: -0.75em;
}
@media not all and (min-height: 30em) {
  .videoOsdVolumeControls {
    display: none !important;
  }
}
.videoOsdVolumeSliderWrapper-customfont {
  font-size: 1rem;
}
@media all and (min-width: 42em), (orientation: portrait) {
  .videoOsd-customFont-remotecontrol-buttons {
    font-size: 1.1em;
  }
}
@media all and (orientation: landscape) {
  .videoOsd-customFont-remotecontrol {
    font-size: 1.1em;
  }
  .videoOsdBottom-split:not(.videoOsdBottom-tvnowplaying) {
    -webkit-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-justify-content: initial;
    justify-content: initial;
  }
  @media all and (min-height: 67em) {
    .videoOsdBottom-split:not(.videoOsdBottom-tvnowplaying) {
      margin-top: 1.5em;
    }
  }
}
@media all and (min-width: 54em) {
  .videoOsd-customFont-remotecontrol-buttons {
    font-size: 1.2em;
  }
}
@media all and (min-width: 80em) {
  .videoOsd-customFont-remotecontrol {
    font-size: 1.2em;
  }
}
.nowplaying-backdropcontainer-blur {
  -webkit-filter: blur(2vh) brightness(0.3);
  filter: blur(2vh) brightness(0.3);
}
.nowplaying-backdropcontainer-blur-high {
  -webkit-filter: blur(9vh) brightness(0.6);
  filter: blur(9vh) brightness(0.6);
}
.nowplaying-backdropcontainer-blur-extrasaturation {
  -webkit-filter: saturate(2) blur(2vh) brightness(0.4);
  filter: saturate(2) blur(2vh) brightness(0.4);
}
.nowplaying-backdropcontainer-blur-extrasaturation.nowplaying-backdropcontainer-blur-high {
  -webkit-filter: saturate(2) blur(9vh) brightness(0.7);
  filter: saturate(2) blur(9vh) brightness(0.7);
}
.nowplaying-backgroundcontainer-blur {
  background-color: rgba(0, 0, 0, 0) !important;
  background-image: none !important;
}
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter: blur(1em)) {
  .nowplaying-backdropcontainer-blur-backdropfilter {
    -webkit-filter: none !important;
    filter: none !important;
  }
  .nowplaying-backgroundcontainer-blur-backdropfilter {
    background-color: rgba(0, 0, 0, 0) !important;
    -webkit-backdrop-filter: saturate(1.4) blur(10vmax) brightness(0.7);
    backdrop-filter: saturate(1.4) blur(10vmax) brightness(0.7);
  }
}
.nowplaying-backgroundcontainer-brighter {
  background-color: rgba(0, 0, 0, 0.65) !important;
}
.doc-nowplaying-blur {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #444 !important;
}
.videoOsd-ratingInfo {
  position: fixed;
  top: 3vh;
  left: 0;
  inset-inline-start: 0;
  inset-inline-end: initial;
  margin-top: 0;
  margin-bottom: 0;
  -webkit-margin-start: 4%;
  margin-inline-start: 4%;
  -webkit-margin-end: 0;
  margin-inline-end: 0;
  overflow: hidden;
}
.videoOsd-ratingText::before {
  content: " ";
  background: #52b54b;
  width: 0.53ch;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  inset-inline-start: 0;
  inset-inline-end: initial;
  border-radius: 0.3em;
}
.videoOsd-ratingText {
  margin: 0;
  padding-top: 0.4em;
  padding-bottom: 0.4em;
  -webkit-padding-start: 0.9em;
  padding-inline-start: 0.9em;
  -webkit-padding-end: 0;
  padding-inline-end: 0;
  position: relative;
  font-weight: 500;
  -webkit-animation: osd-rating-animate 4s ease-out forwards;
  animation: osd-rating-animate 4s ease-out forwards;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
  -webkit-transform-origin: bottom center;
  transform-origin: bottom center;
  opacity: 0;
}
.videoOsd-ratingDescription {
  font-weight: 400;
  margin-top: 0.1em;
}
@-webkit-keyframes osd-rating-animate {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
  }
  15% {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
  85% {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 0;
  }
}
@keyframes osd-rating-animate {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
  }
  15% {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
  85% {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 0;
  }
}
.osd-transport-animationtext {
  position: fixed;
  opacity: 0;
  top: 45%;
  height: 2em;
  box-sizing: border-box;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  text-shadow: #000 0 0 0.5em;
  margin: -1.5em 0 0 0;
  font-weight: 500;
  pointer-events: none;
  touch-action: none;
}
@media all and (orientation: portrait) {
  .osd-transport-animationtext {
    top: 55%;
    margin: -1em 0 0 0;
  }
}
.osd-rew-animationtext {
  left: 2.5%;
  inset-inline-start: 2.5%;
  inset-inline-end: initial;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
[dir="rtl"] .osd-rew-animationtext {
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
.osd-ff-animationtext {
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  right: 2.5%;
  inset-inline-start: initial;
  inset-inline-end: 2.5%;
}
[dir="rtl"] .osd-ff-animationtext {
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
.osd-raisedbutton {
  box-shadow:
    0 0.06933em 0.06933em 0 rgba(0, 0, 0, 0.14),
    0 0.13866em 0.06933em -0.06933em rgba(0, 0, 0, 0.12),
    0 0.06933em 0.208em 0 rgba(0, 0, 0, 0.2);
  padding: 0.54em 2ch !important;
}
.osd-raisedbutton:hover {
  background: hsla(
     var(--theme-text-color-hue),
     var(--theme-text-color-saturation),
     var(--theme-text-color-lightness),
     0.2);
}
.osd-raisedbutton:active {
  color: var(--theme-accent-text-color);
}
.btnPlayNextFromUpNext {
  padding: 0 !important;
  overflow: hidden;
}
.btnPlayNextFromUpNext-inner {
  padding: 0.54em 2ch !important;
  position: relative;
}
.btnPlayNextFromUpNext-progress {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  -webkit-transform-origin: center left;
  transform-origin: center left;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  background: rgba(255, 255, 255, 0.3);
}
[dir="rtl"] .btnPlayNextFromUpNext-progress {
  -webkit-transform-origin: center right;
  transform-origin: center right;
}
.btnPlayNextFromUpNext:focus-visible .btnPlayNextFromUpNext-progress {
  background: rgba(0, 0, 0, 0.3);
}
.btnPlayNextFromUpNext.emby-button-tv:focus .btnPlayNextFromUpNext-progress {
  background: rgba(0, 0, 0, 0.3);
}
.upNextContainer,
.skipIntroContainer {
  position: fixed;
  bottom: 12em;
  bottom: min(12em, 38vh);
  right: 2.5%;
  right: calc(min(5ch, 2%) + 0.7em);
  inset-inline-start: initial;
  inset-inline-end: 2.5%;
  inset-inline-end: calc(min(5ch, 2%) + 0.7em);
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  -webkit-margin-start: 0 !important;
  margin-inline-start: 0 !important;
  -webkit-margin-end: 0 !important;
  margin-inline-end: 0 !important;
  z-index: 1;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}
.videoosd-withupnext {
  display: none !important;
}
.brightnessSliderContainer {
  position: fixed;
  top: 7.5em;
  top: max(7.5em, 15%);
  bottom: 15em;
  bottom: min(15em, 45vh);
  right: 3%;
  inset-inline-start: initial;
  inset-inline-end: 3%;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  z-index: 1;
}
@media all and (pointer: fine) {
  .brightnessSliderContainer {
    display: none !important;
  }
}
@media all and (orientation: portrait) {
  .brightnessSliderContainer {
    display: none !important;
  }
}
.videoOsdBrightnessIcon {
  font-size: 200%;
  margin-bottom: 0.25em;
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
}
.videoOsdUnlockControls {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  padding: 1em 1ch 2em;
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
}
.videoOsd-btnToggleLock-bg {
  background: #fff;
  color: #000;
}
@media all and (pointer: fine) {
  .videoOsd-btnLock {
    display: none !important;
  }
}
