/* SOUL ONE LIVE 4.1.1 — Mixer containment, readable strips and true MASTER.
 * Appended after v34; addresses observed white strip/master truncation at desktop
 * heights. Original range inputs and routing/level state remain untouched.
 */
@media(min-width:1000px) and (min-height:580px) and (pointer:fine){
  /* Three fixed areas with a dedicated, non-scrollable MASTER lane. */
  html:not(.soulone-ipad-classic) body>.app>#mixer.mixer.clean-mixer,
  html:fullscreen body>.app>#mixer.mixer.clean-mixer{
    display:grid!important;
    box-sizing:border-box!important;
    grid-template-rows:minmax(0,1fr)!important;
    grid-template-columns:minmax(190px,220px) minmax(0,1fr) minmax(118px,132px)!important;
    gap:9px!important;
    height:100%!important;
    min-height:0!important;
    min-width:0!important;
    overflow:hidden!important;
    padding:9px 9px 10px!important;
    background:#0f1f2e!important;
    border:1px solid #345064!important;
    border-radius:11px!important;
  }
  body>.app>#mixer.clean-mixer .clean-group{
    display:flex!important;
    flex-direction:column!important;
    box-sizing:border-box!important;
    min-width:0!important;
    min-height:0!important;
    height:100%!important;
    padding:6px!important;
    overflow:hidden!important;
    background:#182c3f!important;
    border:1px solid #365269!important;
    border-radius:8px!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--monitor{
    grid-column:1!important;grid-row:1!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--music{
    grid-column:2!important;grid-row:1!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--master{
    grid-column:3!important;grid-row:1!important;
    min-width:118px!important;
    width:100%!important;
    background:#182c40!important;
    border-color:#426584!important;
  }
  body>.app>#mixer.clean-mixer .clean-group>h3{
    box-sizing:border-box!important;
    display:block!important;
    flex:0 0 18px!important;
    height:18px!important;
    min-height:18px!important;
    max-height:18px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    color:#bbd1df!important;
    font-size:10px!important;
    line-height:18px!important;
    margin:0 3px 5px!important;
    letter-spacing:.055em!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--master>h3{
    color:#91d9ff!important;
  }
  body>.app>#mixer.clean-mixer .clean-rail,
  body>.app>#mixer.clean-mixer .clean-group--master .clean-rail{
    display:flex!important;
    flex:1 1 0!important;
    min-height:0!important;
    max-height:100%!important;
    height:auto!important;
    width:100%!important;
    min-width:0!important;
    align-items:stretch!important;
    padding:0 1px 2px!important;
    margin:0!important;
    gap:7px!important;
    box-sizing:border-box!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--monitor .clean-rail{
    overflow:hidden!important;
    justify-content:space-evenly!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--music .clean-rail{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    justify-content:safe center!important;
    scrollbar-color:#4a6880 transparent;
    scrollbar-width:thin;
  }
  body>.app>#mixer.clean-mixer .clean-group--master .clean-rail{
    overflow:hidden!important;
    justify-content:center!important;
  }
  body>.app>#mixer.clean-mixer .strip,
  body>.app>#mixer.clean-mixer .strip.master{
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    position:relative!important;
    min-height:0!important;
    height:100%!important;
    max-height:100%!important;
    margin:0!important;
    padding:0 0 4px!important;
    overflow:hidden!important;
    background:#22384b!important;
    border:1px solid #3c586e!important;
    border-radius:7px!important;
    transform:none!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--monitor .strip{
    flex:1 1 0!important;
    width:0!important;
    min-width:0!important;
    max-width:none!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--music .strip{
    flex:1 0 108px!important;
    width:auto!important;
    min-width:108px!important;
    max-width:190px!important;
  }
  /* A Master strip has no extra offscreen scroll and must never inherit
     generic track widths from legacy CSS. */
  body>.app>#mixer.clean-mixer .clean-group--master .strip.master{
    display:flex!important;
    flex:1 1 100%!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    background:#20394e!important;
    border:1px solid #48718c!important;
  }
  body>.app>#mixer.clean-mixer .striphead,
  body>.app>#mixer.clean-mixer .strip.master .striphead{
    display:flex!important;
    flex:0 0 42px!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:42px!important;
    min-height:42px!important;
    max-height:42px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    overflow:hidden!important;
    padding:4px 5px!important;
    text-align:center!important;
    line-height:1.1!important;
    font-size:11px!important;
    font-weight:770!important;
    color:#f3f9ff!important;
    border-top:3px solid #6cc0e8!important;
    border-bottom:1px solid #51728a!important;
    background:#246596!important;
  }
  body>.app>#mixer.clean-mixer .striphead .track-title{
    display:block!important;
    flex:1 1 auto!important;
    min-width:0!important;
    max-height:27px!important;
    overflow:hidden!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
    font-size:10px!important;
    line-height:1.2!important;
    text-align:center!important;
    color:#f5fbff!important;
    -webkit-line-clamp:2!important;
  }
  body>.app>#mixer.clean-mixer .striphead .track-head-row{
    display:flex!important;
    width:100%!important;
    align-items:center!important;
    gap:3px!important;
    min-width:0!important;
  }
  body>.app>#mixer.clean-mixer .striphead .route-chip{
    flex:0 0 20px!important;
    width:20px!important;
    min-width:20px!important;
    font-size:9px!important;
    line-height:15px!important;
    padding:1px!important;
  }
  body>.app>#mixer.clean-mixer .strip.master .striphead{
    background:#17639e!important;
    border-color:#6cc4ed!important;
    white-space:nowrap!important;
    letter-spacing:.04em!important;
    font-size:11px!important;
    font-weight:840!important;
  }
  body>.app>#mixer.clean-mixer .strip.master .striphead .emoji{
    display:none!important;
  }
  body>.app>#mixer.clean-mixer .strip.locked .striphead:after{
    display:block!important;
    position:absolute!important;
    top:38px;left:2px;right:2px;
    height:0!important;
    overflow:hidden!important;
    font-size:0!important;
    content:none!important;
  }
  body>.app>#mixer.clean-mixer .strip .faderbox,
  body>.app>#mixer.clean-mixer .strip.master .faderbox{
    display:flex!important;
    flex:1 1 0!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    align-items:stretch!important;
    justify-content:space-evenly!important;
    gap:6px!important;
    margin:0!important;
    padding:8px 3px 4px!important;
    border-radius:0!important;
    background:#172b3d!important;
    overflow:visible!important;
  }
  body>.app>#mixer.clean-mixer .strip .v-range{
    flex:0 1 40px!important;
    width:40px!important;
    min-width:29px!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
  }
  body>.app>#mixer.clean-mixer .strip .meter{
    flex:0 0 10px!important;
    width:10px!important;
    min-width:10px!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    background:#101f2c!important;
    border:1px solid #33536b!important;
  }
  body>.app>#mixer.clean-mixer .strip .db{
    display:block!important;
    box-sizing:border-box!important;
    flex:0 0 21px!important;
    min-height:21px!important;
    height:21px!important;
    margin:0!important;
    padding:0 2px!important;
    overflow:hidden!important;
    text-align:center!important;
    font-size:10px!important;
    font-weight:780!important;
    line-height:21px!important;
    color:#e6f5ff!important;
    white-space:nowrap!important;
    font-variant-numeric:tabular-nums;
  }
  body>.app>#mixer.clean-mixer .strip .dual{
    box-sizing:border-box!important;
    display:flex!important;
    flex:0 0 32px!important;
    height:32px!important;
    min-height:32px!important;
    max-height:32px!important;
    padding:0 5px!important;
    gap:4px!important;
  }
  body>.app>#mixer.clean-mixer .strip .dual button{
    min-height:31px!important;
    height:31px!important;
    line-height:28px!important;
    padding:0!important;
    border:1px solid #496781!important;
    background:#28445b!important;
    color:#edf8ff!important;
    border-radius:5px!important;
    font-size:11px!important;
    font-weight:790!important;
  }
  body>.app>#mixer.clean-mixer .strip .dual button.muted{background:#b43c56!important;border-color:#d85c77!important;color:#fff!important}
  body>.app>#mixer.clean-mixer .strip .dual button.soloed{background:#ad7d28!important;border-color:#dca64a!important;color:#fff!important}
  body>.app>#mixer.clean-mixer .strip .role,
  body>.app>#mixer.clean-mixer .strip.master .master-status{
    display:block!important;
    box-sizing:border-box!important;
    flex:0 0 17px!important;
    min-height:17px!important;
    max-height:17px!important;
    width:100%!important;
    padding:0 2px!important;
    margin:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    text-align:center!important;
    color:#b3ccda!important;
    font-size:9px!important;
    font-weight:670!important;
    line-height:17px!important;
  }
  body>.app>#mixer.clean-mixer .strip.master .db{
    font-size:10px!important;
    font-weight:840!important;
    color:#cceaff!important;
    letter-spacing:.045em!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--master .clean-rail .strip.master{
    visibility:visible!important;
    opacity:1!important;
  }
}
@media(min-width:1000px) and (max-width:1330px) and (min-height:580px) and (pointer:fine){
  body>.app>#mixer.mixer.clean-mixer{
    grid-template-columns:minmax(173px,192px) minmax(0,1fr) minmax(110px,120px)!important;
    gap:7px!important;
    padding:7px!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--master{
    min-width:110px!important;
  }
  body>.app>#mixer.clean-mixer .clean-group--music .strip{
    min-width:97px!important;
    flex-basis:97px!important;
    max-width:168px!important;
  }
  body>.app>#mixer.clean-mixer .strip .faderbox{
    gap:3px!important;
    padding:7px 2px 3px!important;
  }
}
@media(max-width:1100px) and (pointer:coarse){
  /* Preserve the established horizontal mobile mixer and leave enough room
     for its non-scrolling master fader; do not apply desktop 3-column grid. */
  body>.app>#mixer.clean-mixer .strip.master,
  body>.app>#mixer.clean-mixer .clean-group--master .strip.master {
    box-sizing:border-box!important;
    max-width:100%!important;
    overflow:hidden!important;
    background:#203a50!important;
    color:#e7f4fb!important;
  }
  body>.app>#mixer.clean-mixer .strip.master .master-status{
    white-space:nowrap;
    font-size:9px!important;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}
