/* One expanded-player geometry contract, including short visual viewports. */
body.single-player-ui #player-video-panel{
  box-sizing:border-box!important;grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;gap:8px!important;
  max-width:calc(100vw - 32px)!important;max-height:calc(var(--usable-vh,100dvh) - 24px)!important;
  min-height:0!important;padding:0!important;overflow:visible!important;overscroll-behavior:contain;
}
body.single-player-ui #player-video-panel #player-dragzone{width:100%!important;min-width:0!important;max-width:100%!important;grid-column:1/-1!important;grid-row:1!important}
body.single-player-ui #player-video-panel #player-video-shell{
  grid-column:1!important;grid-row:2!important;width:var(--player-w)!important;height:var(--player-h)!important;
  min-width:0!important;min-height:0!important;max-width:100%!important;max-height:none!important;
  aspect-ratio:auto!important;justify-self:center!important;margin:0!important;
}
body.single-player-ui #player-video-panel>.player-video-controls{
  grid-column:1!important;grid-row:3!important;display:flex!important;flex-direction:column!important;
  position:relative!important;inset:auto!important;transform:none!important;
  width:100%!important;min-width:0!important;height:auto!important;min-height:0!important;max-height:none!important;
  padding:0!important;margin:0!important;gap:4px!important;align-self:center!important;overflow:visible!important;
}
body.single-player-ui #player-video-panel .panel-timeline{
  display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;
  position:static!important;width:100%!important;min-width:0!important;gap:8px!important;min-height:44px!important;
  grid-area:auto!important;margin:0!important;transform:none!important;
}
body.single-player-ui #player-video-panel .panel-actions{
  display:flex!important;flex-flow:row wrap!important;align-items:center!important;justify-content:center!important;
  position:static!important;grid-area:auto!important;width:100%!important;min-width:0!important;gap:4px 12px!important;
}
body.single-player-ui #player-video-panel :is(.panel-transport,.panel-utilities,.panel-volume-group){
  display:flex!important;flex-flow:row nowrap!important;align-items:center!important;justify-content:center!important;
  position:static!important;grid-area:auto!important;min-width:0!important;max-width:100%!important;margin:0!important;gap:4px!important;
}
body.single-player-ui #player-video-panel .panel-control{
  width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;padding:10px!important;
  position:static!important;grid-area:auto!important;opacity:1!important;visibility:visible!important;flex-shrink:0!important;
}
body.single-player-ui #player-video-panel .panel-play{width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important}
body.single-player-ui #player-video-panel #panel-fullscreen{display:inline-flex!important;align-items:center!important;justify-content:center!important}
body.single-player-ui #player-video-panel #panel-volume-max{display:none!important}
body.single-player-ui #player-video-panel .panel-volume{width:76px!important;min-width:0!important;height:44px!important}
body.single-player-ui #player-video-panel .panel-time{font-size:14px!important;white-space:nowrap!important}
body.single-player-ui #player-video-panel .panel-seek{min-width:0!important;width:100%!important;height:44px!important}
body.single-player-ui #player-video-panel.player-side-layout{
  grid-template-columns:var(--player-w) var(--utility-w)!important;grid-template-rows:auto auto!important;column-gap:20px!important;
}
body.single-player-ui #player-video-panel.player-side-layout>.player-video-controls{grid-column:2!important;grid-row:2!important}
body.single-player-ui #player-video-panel.player-side-layout .panel-actions{flex-direction:column!important}
@media(max-width:760px){body.single-player-ui #player-video-panel .panel-actions{flex-direction:column!important}}

/* Scroll content inside panels; keep panel headers and exit controls reachable. */
body.single-player-ui :is(#primary-nav#primary-nav,#works-menu#works-menu,#works-catalogue#works-catalogue,#albums-panel#albums-panel),body #atmosphere-panel{
  box-sizing:border-box!important;min-width:0!important;max-width:calc(100vw - 24px)!important;
  max-height:calc(var(--usable-vh,100dvh) - 24px)!important;overscroll-behavior:contain;
}
body.single-player-ui :is(#works-catalogue#works-catalogue,#albums-panel#albums-panel){
  top:calc(var(--viewport-top,0px) + var(--usable-vh,100dvh)/2)!important;
  left:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;min-height:0!important;
}
body.single-player-ui #player-insight-panel#player-insight-panel{max-height:calc(var(--usable-vh,100dvh) - 24px)!important;top:calc(var(--viewport-top,0px) + var(--usable-vh,100dvh)/2)!important}
@media(max-width:760px){body.single-player-ui #player-insight-panel#player-insight-panel{inset:var(--viewport-top,0px) 0 auto!important;height:var(--usable-vh,100dvh)!important;max-height:var(--usable-vh,100dvh)!important;top:var(--viewport-top,0px)!important}}
body.single-player-ui #primary-nav#primary-nav{top:calc(var(--viewport-top,0px) + 12px)!important}
body.single-player-ui #primary-nav#primary-nav{display:flex!important;flex-direction:column!important;overflow:hidden!important}
body.single-player-ui #primary-nav#primary-nav .nav-scroll{min-height:0!important;flex:1 1 auto!important;overflow:auto!important;overscroll-behavior:contain}
body.single-player-ui #primary-nav#primary-nav .nav-header{flex:none!important}
body.single-player-ui :is(#nav-close#nav-close,#browse-close#browse-close,#catalogue-close#catalogue-close,#albums-close#albums-close,#albums-back#albums-back,#catalogue-back#catalogue-back,#player-insight-close#player-insight-close,#player-insight-back#player-insight-back){width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;padding:8px!important;flex-shrink:0!important}
body.single-player-ui #primary-nav#primary-nav .nav-header,body.single-player-ui #works-menu#works-menu .tuner-head{
  position:sticky!important;top:0!important;z-index:3;flex-shrink:0;background:inherit;
}
body.single-player-ui :is(.catalogue-results,.albums-content,.player-insight-copy){min-width:0!important;min-height:0!important;overflow:auto!important}
body.single-player-ui :is(.catalogue-head,.albums-head,.player-insight-head){min-width:0!important;flex-shrink:0!important;gap:8px!important}
body.single-player-ui :is(.catalogue-title,.album-title,.player-insight-copy){overflow-wrap:anywhere}
body #atmosphere-panel{top:calc(var(--viewport-top,0px) + 12px)!important;overflow:auto!important}
body #field-panel{position:fixed;inset:var(--viewport-top,0px) 0 auto 0;width:100%;height:var(--usable-vh,100dvh);max-height:var(--usable-vh,100dvh)}
body #field-panel .field-shell,body #field-panel .field-scroll{min-height:0;min-width:0}
body #field-panel .field-sheet{max-height:100%;overflow:hidden}
body #field-panel .field-sheet-card{max-height:100%;min-height:0;min-width:0}
body #field-panel .field-sheet-head{flex-shrink:0;gap:8px}
body #field-panel .field-mantra-card{max-height:100%}
body #field-panel .field-mantra-body{min-height:0;overflow:auto}
body #field-panel .field-mantra-footer{padding-bottom:max(12px,env(safe-area-inset-bottom))}
body #field-panel :is(.field-header,.field-header-actions,.field-input-row,.field-effect-row,.field-gap-row){min-width:0}
body #field-panel :is(select,textarea){max-width:100%;min-width:0}
@media(max-width:420px){
  body #field-panel .field-header{padding:10px 12px;gap:6px;flex-wrap:wrap}
  body #field-panel .field-heading{gap:8px}
  body #field-panel .field-heading h2{font-size:27px}
  body #field-panel .field-heading>span{display:none}
  body #field-panel .field-header-actions{gap:2px}
  body #field-panel .field-sound{min-width:44px;padding:8px}
  body #field-panel .field-sound>span{font-size:12px}
  body #field-panel .field-input-row{display:flex;flex-wrap:wrap;gap:8px}
  body #field-panel .field-input-row>*{flex:1 1 auto}
  body #field-panel .field-clip{flex-wrap:wrap;gap:8px}
  body #field-panel .field-gap-row{flex-wrap:wrap}
  body #field-panel .field-gap-values{margin-left:auto}
}
@media(max-height:480px){
  body #field-panel .field-header{padding-top:6px;padding-bottom:6px}
  body #field-panel .field-footer{padding-top:8px;padding-bottom:8px}
  body #field-panel .field-mantra-sheet{padding:8px}
  body #field-panel .field-mantra-card>.field-sheet-head{padding:8px 14px}
  body #field-panel .field-mantra-footer{padding:6px 14px 8px}
  body #field-panel .field-mantra-footer>.field-mantra-help{margin-bottom:4px}
}
