/* Magic 1Xtra TV Player UX V2 — only the dedicated native video route.
   Keep player JS, media sources, native controls and routing untouched. */
body.video-playback-active:has(.native-only-video-screen) {overflow:hidden!important;background:#05070c!important}
body.video-playback-active .native-only-video-screen .dedicated-video-mount,
body.video-playback-active .native-only-video-screen .xtra-dedicated-player {
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  max-width:none!important;margin:0!important;padding:0!important;background:#05070c!important;
}
/* Compact toolbar with reliable exit control; no overlay on video. */
body.video-playback-active .native-only-video-screen .xtra-dedicated-player .dedicated-player-nav {
  position:absolute!important;top:0!important;left:0!important;right:0!important;
  height:56px!important;box-sizing:border-box!important;padding:6px 12px!important;
  display:flex!important;align-items:center!important;gap:10px!important;
  border:0!important;border-radius:0!important;background:#0b0f18!important;
  z-index:60!important;pointer-events:auto!important;
}
body.video-playback-active .native-only-video-screen .dedicated-player-back {
  width:40px!important;height:40px!important;flex:0 0 40px!important;
  border-radius:50%!important;font-size:27px!important;box-shadow:none!important;
  border:1px solid #354153!important;background:#131d2b!important;
}
body.video-playback-active .native-only-video-screen .dedicated-player-title {
  flex:1 1 auto!important;text-align:center!important;min-width:0!important;
  padding:0!important;background:none!important;backdrop-filter:none!important;
}
body.video-playback-active .native-only-video-screen .dedicated-player-title b {
  display:block!important;max-width:100%!important;font-size:14px!important;
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
}
body.video-playback-active .native-only-video-screen .mx-flutter-nowplaying-action {
  flex:0 0 34px!important;min-width:34px!important;min-height:40px!important;
  pointer-events:auto!important;
}
/* Desktop: video gets the usable viewport below toolbar, centered in widescreen. */
body.video-playback-active .native-only-video-screen .xtra-dedicated-player .xtra-dedicated-stage {
  position:absolute!important;left:0!important;right:0!important;top:56px!important;
  bottom:0!important;width:100%!important;height:calc(100dvh - 56px)!important;
  max-height:calc(100dvh - 56px)!important;box-sizing:border-box!important;
  padding:0!important;margin:0!important;overflow:hidden!important;background:#000!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
body.video-playback-active .native-only-video-screen .xtra-dedicated-stage::after {display:none!important}
body.video-playback-active .native-only-video-screen .xtra-djmix-video-player,
body.video-playback-active .native-only-video-screen .xtra-djmix-video-stage,
body.video-playback-active .native-only-video-screen .player-video-wrap {
  position:relative!important;inset:auto!important;display:flex!important;
  align-items:center!important;justify-content:center!important;
  box-sizing:border-box!important;margin:0 auto!important;padding:0!important;
  width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;
  border:0!important;border-radius:0!important;overflow:hidden!important;background:#000!important;
}
body.video-playback-active .native-only-video-screen video,
body.video-playback-active .native-only-video-screen iframe {
  display:block!important;width:100%!important;height:100%!important;
  max-width:100%!important;max-height:100%!important;
  aspect-ratio:auto!important;object-fit:contain!important;border:0!important;
  border-radius:0!important;box-shadow:none!important;background:#000!important;
}
/* Phone portrait: put the broadcast directly below the toolbar instead of
   vertically centering a tiny video in a full-height black canvas. */
@media (max-width:700px) and (orientation:portrait) {
  body.video-playback-active .native-only-video-screen .xtra-dedicated-player .xtra-dedicated-stage {
    top:56px!important;bottom:auto!important;
    width:100vw!important;height:calc(100vw * 9 / 16)!important;
    max-height:calc(100dvh - 56px)!important;min-height:0!important;
    display:block!important;overflow:hidden!important;
  }
  body.video-playback-active .native-only-video-screen .xtra-djmix-video-player,
  body.video-playback-active .native-only-video-screen .xtra-djmix-video-stage,
  body.video-playback-active .native-only-video-screen .player-video-wrap {
    width:100%!important;height:100%!important;max-height:100%!important;
  }
  body.video-playback-active .native-only-video-screen .xtra-dedicated-player::after {
    content:'Rotate your phone or use fullscreen for a larger picture';
    position:absolute;top:calc(56px + 100vw * 9 / 16 + 18px);left:16px;right:16px;
    color:#9ca6b6;text-align:center;font-size:12px;line-height:1.5;
    pointer-events:none;z-index:1;
  }
}
@media (max-width:700px) and (orientation:landscape) {
  body.video-playback-active .native-only-video-screen .xtra-dedicated-player .dedicated-player-nav {
    height:42px!important;padding:1px 10px!important;
  }
  body.video-playback-active .native-only-video-screen .xtra-dedicated-player .xtra-dedicated-stage {
    top:42px!important;height:calc(100dvh - 42px)!important;
    max-height:calc(100dvh - 42px)!important;
  }
}
@media (prefers-reduced-motion:reduce) {
  body.video-playback-active .native-only-video-screen * {scroll-behavior:auto!important}
}