/* SOUL ONE LIVE 4.8.1 — MEZCLA: FLEX CONSOLE FIX
 * View-only correction. The old version assigned 4 grid rows but legacy
 * grid-row:5 still claimed the mixer, shrinking its row to ~0px.
 * A single vertical flex layout removes this entire grid-row conflict.
 * Audio nodes, faders, values, Master, Guide, Click, transport and library
 * remain mounted and their playback/control handlers are unchanged.
 */
@media (min-width:1000px) and (min-height:580px) and (pointer:fine){
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix,
  html:fullscreen body>.app.sl-mode-mix {
    display:flex!important;
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    box-sizing:border-box!important;
    height:100dvh!important;
    max-height:100dvh!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
    /* No grid-row reservation: each visible child gets its own height. */
    grid-template-rows:none!important;
    grid-auto-rows:auto!important;
    gap:6px!important;
  }
  /* Header + four-view navigation stay put. */
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>.top.stage-header,
  html:fullscreen body>.app.sl-mode-mix>.top.stage-header{
    display:grid!important;
    flex:0 0 76px!important;
    box-sizing:border-box!important;
    height:76px!important;
    min-height:76px!important;
    max-height:76px!important;
    width:100%!important;
    align-self:stretch!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix.sl-header-minimized>.top.stage-header,
  html:fullscreen body>.app.sl-mode-mix.sl-header-minimized>.top.stage-header{
    flex-basis:44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>.stage-footer-note,
  html:fullscreen body>.app.sl-mode-mix>.stage-footer-note{
    display:grid!important;
    box-sizing:border-box!important;
    flex:0 0 43px!important;
    height:43px!important;
    min-height:43px!important;
    max-height:43px!important;
    width:100%!important;
    align-self:stretch!important;
    overflow:hidden!important;
  }
  /* Eliminate the completely empty visual stage and its status pill.
     These nodes remain in the DOM, so audio state is NOT destroyed. */
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>.main-grid,
  html:fullscreen body>.app.sl-mode-mix>.main-grid{
    display:none!important;
    flex:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>.sl-arrangement-map,
  html:fullscreen body>.app.sl-mode-mix>.sl-arrangement-map,
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer ~ .panel,
  html:fullscreen body>.app.sl-mode-mix>#mixer ~ .panel,
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer ~ .bottomline,
  html:fullscreen body>.app.sl-mode-mix>#mixer ~ .bottomline{
    display:none!important;
    flex:none!important;
  }
  /* The tiny mixer header is an ordinary flex item. Previous grid-row
     assignment is harmless but reset for clarity. */
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix:not(.stage-mixer-collapsed)>.meter-title,
  html:fullscreen body>.app.sl-mode-mix:not(.stage-mixer-collapsed)>.meter-title{
    display:flex!important;
    flex:0 0 43px!important;
    align-items:center!important;
    box-sizing:border-box!important;
    position:relative!important;
    width:100%!important;
    height:43px!important;
    min-height:43px!important;
    max-height:43px!important;
    margin:0!important;
    padding:3px 10px!important;
    gap:9px!important;
    border:1px solid #304e65!important;
    border-radius:8px!important;
    background:#112638!important;
    overflow:hidden!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>.meter-title .sl-mixer-collapse-toggle,
  html:fullscreen body>.app.sl-mode-mix>.meter-title .sl-mixer-collapse-toggle{
    margin-left:auto!important;
  }
  /* The mixer itself is the flex item that consumes ALL available space.
     Explicitly cancel v35/v43's height:100%, grid-row and max-height.
     This is the essential fix for the screenshot's 45px-high mixer. */
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix:not(.stage-mixer-collapsed)>#mixer.mixer.clean-mixer,
  html:fullscreen body>.app.sl-mode-mix:not(.stage-mixer-collapsed)>#mixer.mixer.clean-mixer{
    display:grid!important;
    position:relative!important;
    flex:1 1 0%!important;
    align-self:stretch!important;
    box-sizing:border-box!important;
    grid-template-rows:minmax(0,1fr)!important;
    grid-template-columns:minmax(190px,220px) minmax(0,1fr) minmax(118px,134px)!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:9px!important;
    gap:9px!important;
    overflow:hidden!important;
    background:#102337!important;
    border:1px solid #36586e!important;
    border-radius:10px!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group{
    box-sizing:border-box!important;
    min-width:0!important;
    min-height:0!important;
    height:100%!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group .clean-rail,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group .clean-rail{
    min-height:0!important;
    max-height:none!important;
    height:auto!important;
    flex:1 1 0%!important;
    overflow-y:hidden!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group--music .clean-rail,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group--music .clean-rail{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .strip,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .strip{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .strip .faderbox,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .strip .faderbox{
    display:flex!important;
    flex:1 1 0%!important;
    height:auto!important;
    max-height:none!important;
    min-height:80px!important;
    overflow:hidden!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .strip .v-range,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .strip .v-range{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group--master,
  html:fullscreen body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group--master{
    min-width:118px!important;
    grid-column:3!important;
  }
}
@media (min-width:1000px) and (max-width:1330px) and (min-height:580px) and (pointer:fine){
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix:not(.stage-mixer-collapsed)>#mixer.mixer.clean-mixer,
  html:fullscreen body>.app.sl-mode-mix:not(.stage-mixer-collapsed)>#mixer.mixer.clean-mixer{
    grid-template-columns:minmax(170px,192px) minmax(0,1fr) minmax(112px,122px)!important;
    gap:7px!important;
    padding:7px!important;
  }
  html:not(.soulone-ipad-classic) body>.app.sl-mode-mix>#mixer.clean-mixer .clean-group--master{min-width:112px!important}
}
/* Existing mobile/iPad mixer and all other desktop views unchanged. */