/* SoulOne LIVE v62 — mobile viewport containment & comfortable touch.
   Presentation only: preserve player, route, fader, panel and cloud listeners.
   Loaded after the previous mobile themes to resolve competing fixed widths. */
@media (max-width:1100px) and (pointer:coarse) {
  html:not(.soulone-ipad-classic),
  html:not(.soulone-ipad-classic) body {
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    overflow:hidden!important;
    overscroll-behavior:none;
  }
  html:not(.soulone-ipad-classic) body>.app.soul-mobile-console {
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    padding:
      max(4px,env(safe-area-inset-top))
      max(6px,env(safe-area-inset-right))
      max(4px,env(safe-area-inset-bottom))
      max(6px,env(safe-area-inset-left))!important;
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    overflow:hidden!important;
    overscroll-behavior:contain!important;
  }
  body>.app.soul-mobile-console :is(.main-grid,.live-workspace,.timeline,.right.live-library-panel,.progress-panel,.sl-mobile-presets,.sl49-repertoire-header,#mixer,.clean-group,.clean-rail) {
    box-sizing:border-box!important;
    min-width:0!important;
    max-width:100%!important;
  }
  /* The header and the four view selectors should never steal the stage.
     Musical control columns must shrink as an actual grid, not overflow via
     earlier 109px + 52px + 113px minima. */
  html:not(.soulone-ipad-classic) body>.app.soul-mobile-console>.top.stage-header {
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(222px,min(40vw,320px)) 77px!important;
    grid-template-rows:minmax(0,1fr)!important;
    align-items:center!important;
    flex:0 0 53px!important;
    height:53px!important;
    min-height:53px!important;
    max-height:53px!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:4px 7px!important;
    overflow:visible!important;
  }
  body>.app.soul-mobile-console .stage-identity {
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    flex-wrap:nowrap!important;
    gap:7px!important;
  }
  body>.app.soul-mobile-console .stage-identity .brand {
    flex:0 0 auto!important;
    min-width:0!important;
    max-width:max-content!important;
    gap:4px!important;
  }
  body>.app.soul-mobile-console .stage-identity .brand .soulone-family-emblem {
    width:30px!important;height:30px!important;min-width:30px!important;
    flex:0 0 30px!important;object-fit:contain!important;
  }
  body>.app.soul-mobile-console .stage-identity .song-head {
    flex:1 1 0%!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding-left:7px!important;
    margin:0!important;
  }
  body>.app.soul-mobile-console .stage-identity .song-head>div {
    min-width:0!important;max-width:100%!important;
  }
  body>.app.soul-mobile-console .song-head :is(strong,small) {
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
  }
  body>.app.soul-mobile-console .stage-center {
    box-sizing:border-box!important;
    grid-column:2!important;grid-row:1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px minmax(0,1.1fr)!important;
    width:100%!important;
    min-width:0!important;max-width:100%!important;
    height:45px!important;min-height:45px!important;max-height:45px!important;
    padding:2px 3px!important;
    gap:0!important;
    overflow:hidden!important;
  }
  body>.app.soul-mobile-console .stage-center .stage-field {
    width:100%!important;min-width:0!important;
    max-width:100%!important;
    padding:0 2px!important;gap:1px!important;
  }
  body>.app.soul-mobile-console .stage-center .field-label {
    font-size:9px!important;
    line-height:11px!important;
    overflow:hidden!important;text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body>.app.soul-mobile-console .stage-center :is(.value-row,.ctl-group) {
    box-sizing:border-box!important;
    width:100%!important;min-width:0!important;
    gap:3px!important;
    height:26px!important;min-height:26px!important;
    flex:0 0 26px!important;
  }
  body>.app.soul-mobile-console .stage-center :is(.value-row,.ctl-group) button {
    flex:0 0 25px!important;
    width:25px!important;min-width:25px!important;max-width:25px!important;
    height:26px!important;min-height:26px!important;max-height:26px!important;
  }
  body>.app.soul-mobile-console .stage-center :is(#headerTempoVal,#originalKey,#pitchVal) {
    min-width:0!important;max-width:40px!important;
    width:auto!important;flex:0 1 auto!important;
    font-size:16px!important;line-height:25px!important;
  }
  body>.app.soul-mobile-console .stage-actions {
    box-sizing:border-box!important;
    grid-column:3!important;grid-row:1!important;
    width:77px!important;min-width:0!important;max-width:77px!important;
    display:flex!important;justify-content:flex-end!important;
    align-items:center!important;flex-wrap:nowrap!important;
    gap:5px!important;
  }
  body>.app.soul-mobile-console>.sl-mobile-view-nav:not([hidden]) {
    box-sizing:border-box!important;
    display:flex!important;
    flex:0 0 41px!important;
    height:41px!important;
    min-height:41px!important;
    max-height:41px!important;
    width:100%!important;min-width:0!important;
    max-width:100%!important;
    padding:0!important;
    align-items:stretch!important;
    flex-wrap:nowrap!important;
    overflow:visible!important;
    gap:4px!important;
  }
  body>.app.soul-mobile-console .sl-mobile-presets {
    box-sizing:border-box!important;
    flex:1 1 0%!important;
    display:flex!important;flex-wrap:nowrap!important;
    min-width:0!important;
    max-width:calc(100% - 45px)!important;
    padding:2px!important;
    gap:2px!important;
    overflow:hidden!important;
  }
  body>.app.soul-mobile-console .sl-mobile-presets .sl-mobile-preset {
    flex:1 1 0%!important;
    width:0!important;
    min-width:0!important;
    max-width:none!important;
    height:35px!important;min-height:35px!important;max-height:35px!important;
    padding:3px 1px!important;
    font-size:clamp(9px,1.5vw,11px)!important;
    line-height:1.15!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    touch-action:manipulation!important;
  }
  body>.app.soul-mobile-console .sl-mobile-view-nav .sl-mobile-audio-trigger {
    flex:0 0 40px!important;
    height:41px!important;min-height:41px!important;max-height:41px!important;
    margin:0!important;padding:0!important;
  }
  body>.app.soul-mobile-console>.main-grid {
    box-sizing:border-box!important;
    flex:1 1 0%!important;
    height:auto!important;min-height:0!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;padding:0!important;
    gap:6px!important;
    overflow:hidden!important;
  }
  body>.app.soul-mobile-console.slmv-show-stage.slmv-show-repertoire:not(.soul-mobile-mix-screen)>.main-grid {
    grid-template-columns:minmax(0,1.45fr) minmax(172px,.85fr)!important;
  }
  body>.app.soul-mobile-console.slmv-show-stage.slmv-hide-repertoire:not(.soul-mobile-mix-screen)>.main-grid,
  body>.app.soul-mobile-console.slmv-hide-stage.slmv-show-repertoire:not(.soul-mobile-mix-screen)>.main-grid {
    grid-template-columns:minmax(0,1fr)!important;
  }
  body>.app.soul-mobile-console .main-grid>.live-workspace,
  body>.app.soul-mobile-console .main-grid>.right.live-library-panel {
    min-width:0!important;min-height:0!important;
    max-height:100%!important;
  }
  body>.app.soul-mobile-console .main-grid>.live-workspace>.timeline {
    flex:1 1 0%!important;
    min-height:0!important;
    min-width:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  body>.app.soul-mobile-console .timeline .heading,
  body>.app.soul-mobile-console .timeline .section-nav,
  body>.app.soul-mobile-console .timeline .heading>div {
    min-width:0!important;max-width:100%!important;
  }
  body>.app.soul-mobile-console .timeline .heading .section-label {
    min-width:0!important;max-width:90px!important;
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  }
  /* The former 780px artificial track minimum is larger than phone screens.
     Only 7vw of horizontal pan remains; vertical access reaches every stem. */
  body>.app.soul-mobile-console .timeline .sl57-session-scroll {
    min-width:0!important;max-width:100%!important;
    width:100%!important;
    flex:1 1 0%!important;
    overflow-x:auto!important;overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin;
  }
  body>.app.soul-mobile-console .timeline .sl57-session-scroll>.segments,
  body>.app.soul-mobile-console .timeline .sl57-session-scroll>.stems-visual,
  body>.app.soul-mobile-console .timeline .sl57-session-scroll>.time-numbers {
    box-sizing:border-box!important;
    width:calc(100% + clamp(20px,7vw,64px))!important;
    min-width:calc(100% + clamp(20px,7vw,64px))!important;
    max-width:none!important;
  }
  body>.app.soul-mobile-console .timeline .sl57-session-scroll .wave-row {
    max-width:100%!important;
  }
  body>.app.soul-mobile-console .right.live-library-panel>.tabcontent {
    box-sizing:border-box!important;
    flex:1 1 0%!important;
    min-width:0!important;min-height:0!important;
    width:100%!important;max-width:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:contain!important;
  }
  body>.app.soul-mobile-console .right.live-library-panel .setlist,
  body>.app.soul-mobile-console .right.live-library-panel .songitem {
    box-sizing:border-box!important;
    min-width:0!important;
    max-width:100%!important;
  }
  body>.app.soul-mobile-console .right.live-library-panel .songitem .name {
    min-width:0!important;max-width:100%!important;overflow:hidden!important;
  }
  body>.app.soul-mobile-console .right.live-library-panel .songitem .name :is(b,small) {
    display:block!important;max-width:100%!important;
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  }
  body>.app.soul-mobile-console .right.live-library-panel .sl57-reorder-handle {
    flex:0 0 30px!important;min-width:30px!important;
    width:30px!important;min-height:30px!important;
    touch-action:none!important;
  }
  /* Mixer stays contained. In very short landscape viewports, scroll only
     inside the mixer instead of cropping the lower fader actions. */
  body>.app.soul-mobile-console.soul-mobile-mix-screen>.main-grid {
    display:none!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen>.meter-title {
    box-sizing:border-box!important;
    flex:0 0 31px!important;height:31px!important;
    min-height:31px!important;max-height:31px!important;
    width:100%!important;max-width:100%!important;
    padding:2px 8px!important;
    overflow:hidden!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen>#mixer.mixer.clean-mixer {
    box-sizing:border-box!important;
    position:relative!important;
    flex:1 1 0%!important;
    width:100%!important;
    min-width:0!important;max-width:100%!important;
    min-height:0!important;
    height:auto!important;max-height:none!important;
    grid-template-columns:minmax(118px,25%) minmax(0,1fr) minmax(85px,17%)!important;
    grid-template-rows:minmax(175px,1fr)!important;
    gap:4px!important;padding:5px!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen #mixer .clean-group {
    min-width:0!important;max-width:100%!important;
    min-height:0!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen #mixer .clean-group--music .clean-rail {
    width:100%!important;
    min-width:0!important;
    overflow-x:auto!important;overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-x:contain!important;
    touch-action:pan-x!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen #mixer .clean-group--master {
    grid-column:3!important;grid-row:1!important;
    min-width:0!important;max-width:100%!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen #mixer .strip {
    box-sizing:border-box!important;
    max-width:100%!important;
    min-height:0!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen #mixer input[type=range] {
    touch-action:none!important;
  }
  /* Menus and editors are bounded by the VISUAL viewport, including notches
     and the browser toolbar; buttons never become stranded off-screen. */
  body>.app.soul-mobile-console .stage-menu:not([hidden]) {
    box-sizing:border-box!important;
    position:fixed!important;
    z-index:2147483000!important;
    top:max(53px,calc(env(safe-area-inset-top) + 48px))!important;
    right:max(8px,env(safe-area-inset-right))!important;
    left:auto!important;
    width:min(330px,calc(100vw - 24px))!important;
    min-width:0!important;max-width:calc(100vw - 24px)!important;
    max-height:calc(100dvh - 64px - env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }
  body>.app.soul-mobile-console :is(.sl-mobile-audio-menu,.sl-mobile-windows-menu):not([hidden]) {
    box-sizing:border-box!important;
    max-width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 24px - env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }
  :is(.sl-song-menu,.sl-editor,#helpOverlay .shortcut-modal,.sl60-bpm-dialog,.cloud-dialog,.modal) {
    box-sizing:border-box!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body>.app.soul-mobile-console .stage-footer-note {
    box-sizing:border-box!important;
    flex:0 0 auto!important;
    min-width:0!important;max-width:100%!important;
    overflow:hidden!important;
  }
  body>.app.soul-mobile-console .stage-footer-note>span {
    min-width:0!important;max-width:100%!important;
    overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;
  }
  #sl52-access .sl52-panel {
    box-sizing:border-box!important;
    width:min(100%,560px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
    overflow-y:auto!important;
  }
}
@media (max-width:700px) and (pointer:coarse) and (orientation:landscape) {
  body>.app.soul-mobile-console .stage-identity .soulone-family-wordmark {
    display:none!important;
  }
  body>.app.soul-mobile-console .stage-identity .song-head {
    padding-left:5px!important;
  }
}
@media (max-width:1100px) and (pointer:coarse) and (orientation:landscape) and (max-height:430px) {
  html:not(.soulone-ipad-classic) body>.app.soul-mobile-console {
    gap:4px!important;
    padding-top:max(2px,env(safe-area-inset-top))!important;
    padding-bottom:max(2px,env(safe-area-inset-bottom))!important;
  }
  html:not(.soulone-ipad-classic) body>.app.soul-mobile-console>.top.stage-header {
    flex-basis:48px!important;
    height:48px!important;min-height:48px!important;max-height:48px!important;
  }
  body>.app.soul-mobile-console .stage-center {
    height:42px!important;min-height:42px!important;max-height:42px!important;
  }
  body>.app.soul-mobile-console>.sl-mobile-view-nav:not([hidden]) {
    flex-basis:37px!important;
    height:37px!important;min-height:37px!important;max-height:37px!important;
  }
  body>.app.soul-mobile-console .sl-mobile-presets .sl-mobile-preset {
    height:31px!important;min-height:31px!important;max-height:31px!important;
  }
  body>.app.soul-mobile-console .sl-mobile-view-nav .sl-mobile-audio-trigger {
    height:37px!important;min-height:37px!important;max-height:37px!important;
  }
  body>.app.soul-mobile-console .stage-footer-note {
    display:none!important;
  }
  body>.app.soul-mobile-console .timeline .heading {
    flex:0 0 auto!important;
    padding-bottom:3px!important;margin-bottom:3px!important;
  }
  body>.app.soul-mobile-console .main-grid>.live-workspace>.progress-panel {
    flex:0 0 47px!important;
    min-height:47px!important;
  }
  body>.app.soul-mobile-console.soul-mobile-mix-screen>.meter-title {
    flex-basis:28px!important;
    height:28px!important;min-height:28px!important;max-height:28px!important;
  }
}
