/* Nexus 18.22z — public Hero fullscreen + mobile video controls. */
body.nexus-page-public .nexus-hero-fullscreen {
  display:grid;place-items:center;flex:0 0 36px;
  box-sizing:border-box;width:36px;height:36px;min-width:36px;min-height:36px;padding:0;
  border:1px solid rgba(143,216,255,.25);border-radius:7px;
  color:#eaf6ff;background:rgba(143,216,255,.04);cursor:pointer;
}
body.nexus-page-public .nexus-hero-fullscreen:hover,
body.nexus-page-public .nexus-hero-fullscreen.is-active {
  border-color:rgba(127,255,212,.58);color:#7fffd4;background:rgba(127,255,212,.1);
}
body.nexus-page-public .nexus-hero-fullscreen:focus-visible {outline:2px solid #80e9ff;outline-offset:2px}
body.nexus-page-public .nexus-hero-fullscreen:disabled{opacity:.55;cursor:wait}

/* 18.23b: keep the detached page player between the isolated Three.js stage
   (z=0) and the HTML page shell (z=2). It must NOT obscure social cards,
   links or article text. The body-level player mount makes this possible
   without reparenting the live YouTube/Twitch iframe. Header (80), footer (9)
   and desktop transport controls (35) stay above the video. Do not apply
   this sandwich to embed, true fullscreen or spatial/CSS3D video surfaces. */
body.nexus-page-public .nexus-global-media-player-host.msp-player[data-mode="detached"]:not(.is-nexus-3d-spatial):not(.is-nexus-3d-css3d):not(:fullscreen),
body.nexus-page-public .nexus-global-media-player-host.msp-player.msp-popout:not(.is-nexus-3d-spatial):not(.is-nexus-3d-css3d):not(:fullscreen){
  z-index:1!important;
  bottom:calc(var(--nexus-video-footer-overlap, 0px) + 12px)!important;
  max-height:max(80px, calc(100dvh - var(--nexus-video-header-overlap, 0px) - var(--nexus-video-footer-overlap, 0px) - 24px))!important;
}
/* Desktop controls are lower than the page drawer and follow visible footer.
   Mobile controls already live in the existing drawer and remain in flow. */
body.nexus-page-public .nexus-spatial-media-controls:not(.nexus-spatial-media-controls--mobile){
  z-index:35!important;bottom:calc(var(--nexus-video-footer-overlap, 0px) + 12px)!important;
  max-height:calc(100dvh - var(--nexus-video-header-overlap, 0px) - var(--nexus-video-footer-overlap, 0px) - 24px);
  overflow-y:auto;
}
@media (max-width:650px), (max-height:500px) and (max-width:900px) {
  /* Five compact header slots: Hero | Planer | Login | Fullscreen | Menu.
     This overrides 18.22y's four-slot layout without duplicating controls. */
  body.nexus-page-public .nexus-page-bar__inner {
    grid-template-columns:minmax(0,1fr) repeat(4,38px);
    column-gap:4px;
  }
  body.nexus-page-public .nexus-page-menu-toggle {grid-column:5;grid-row:1}
  body.nexus-page-public .nexus-page-account > .nexus-side-window__launcher--left {grid-column:2;grid-row:1}
  body.nexus-page-public .nexus-page-account > a[data-nexus-account-toggle],
  body.nexus-page-public .nexus-page-account > .nexus-page-account__toggle--user {grid-column:3;grid-row:1}
  body.nexus-page-public .nexus-page-account > .nexus-hero-fullscreen {
    grid-column:4;grid-row:1;width:38px;min-width:38px;height:38px;min-height:38px;
    justify-self:end;align-self:center;
  }
  body.nexus-page-public .nexus-page-account > .nexus-3d-camera-admin {
    grid-column:1 / 6;grid-row:2;justify-self:end;
  }
  /* Only the original video-control panel moves into the EXISTING mobile drawer.
     No fixed viewport popup may cover the legal footer. */
  body.nexus-page-public .nexus-page-nav .nexus-spatial-media-controls--mobile {
    position:relative!important;inset:auto!important;z-index:auto!important;
    width:calc(100% - 24px)!important;max-width:none!important;
    min-width:0;margin:12px;padding:12px!important;
    border:1px solid rgba(143,216,255,.28)!important;border-radius:10px!important;
    background:#102237!important;box-shadow:none!important;
  }
  body.nexus-page-public .nexus-page-nav .nexus-spatial-media-controls--mobile [data-control] {max-width:100%;min-width:0}
  body.nexus-page-public .nexus-page-nav .nexus-spatial-media-controls--mobile [data-control="volume"] {width:90px!important}
  body.nexus-page-public .nexus-page-nav .nexus-spatial-media-controls--mobile [data-control="seek"] {width:100%;flex:1 1 80px!important}
  body.nexus-page-public .nexus-page-nav .nexus-spatial-media-controls--mobile[hidden] {display:none!important}
  /* The detached mini-player uses the same transport controls in the mobile
     menu. Keep native-required provider chrome accessible. */
  body.nexus-page-public:has([data-nexus-page-menu])
    .nexus-global-media-player-host.msp-player[data-mode="detached"]:not(.is-nexus-3d-spatial):not(.msp-native-controls-required) .msp-chrome {
    display:none!important;
  }
  /* Detached popout never sits over the actual visible footer; no change to
     embedded, CSS3D-spatial, or true fullscreen video playback. */
  body.nexus-page-public .nexus-global-media-player-host.msp-player[data-mode="detached"]:not(.is-nexus-3d-spatial):not(.is-nexus-3d-css3d):not(:fullscreen),
  body.nexus-page-public .nexus-global-media-player-host.msp-player.msp-popout:not(.is-nexus-3d-spatial):not(.is-nexus-3d-css3d):not(:fullscreen) {
    bottom:calc(var(--nexus-video-footer-overlap, 0px) + 10px)!important;
    max-height:calc(100dvh - var(--nexus-video-header-overlap, 0px) - var(--nexus-video-footer-overlap, 0px) - 24px)!important;
    width:min(360px,calc(100vw - 16px));
  }
}
