/* StitchOS 2.0 mobile drawer: fixed shell + dedicated nav scroller */
@media (max-width:850px){
  body.mbb-side-open{overflow:hidden!important;}

  body.mbb-side-open .side.menu-open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    filter:none!important;
    mix-blend-mode:normal!important;
    color:#f5f8ff!important;
    background:#0b1018!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    transform:translateX(0)!important;
    z-index:2147482800!important;

    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:auto!important;
    width:60vw!important;
    max-width:60vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;

    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    padding:max(54px,calc(env(safe-area-inset-top) + 48px)) 10px max(8px,env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
  }

  body.mbb-side-open .side.menu-open .brand,
  body.mbb-side-open .side.menu-open .company-side{
    flex:0 0 auto!important;
    opacity:1!important;
    visibility:visible!important;
    filter:none!important;
    pointer-events:auto!important;
    margin-bottom:8px!important;
  }

  body.mbb-side-open .side.menu-open .nav{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;
    touch-action:pan-y!important;
    padding:0 2px max(220px,calc(190px + env(safe-area-inset-bottom))) 0!important;
    scrollbar-width:thin!important;
    scrollbar-color:#617491 transparent!important;
  }

  body.mbb-side-open .side.menu-open .nav::-webkit-scrollbar{width:5px!important;}
  body.mbb-side-open .side.menu-open .nav::-webkit-scrollbar-thumb{background:#617491!important;border-radius:999px!important;}
  body.mbb-side-open .side.menu-open .nav::-webkit-scrollbar-track{background:transparent!important;}

  body.mbb-side-open .side.menu-open .nav,
  body.mbb-side-open .side.menu-open .nav *,
  body.mbb-side-open .side.menu-open .nav button,
  body.mbb-side-open .side.menu-open .nav a,
  body.mbb-side-open .side.menu-open .nav label{
    touch-action:pan-y!important;
  }

  body.mbb-side-open .side.menu-open .nav-group,
  body.mbb-side-open .side.menu-open .nav-group-head,
  body.mbb-side-open .side.menu-open .nav-items,
  body.mbb-side-open .side.menu-open #mbbStitchOSButton,
  body.mbb-side-open .side.menu-open #logout,
  body.mbb-side-open .side.menu-open .no-electronics-menu-control{
    opacity:1!important;
    visibility:visible!important;
    filter:none!important;
    pointer-events:auto!important;
  }

  body.mbb-side-open .side.menu-open .nav button,
  body.mbb-side-open .side.menu-open .nav a,
  body.mbb-side-open .side.menu-open #mbbStitchOSButton,
  body.mbb-side-open .side.menu-open #logout{
    position:relative!important;
    z-index:2!important;
    pointer-events:auto!important;
    opacity:1!important;
    color:#f5f8ff!important;
  }

  body.mbb-side-open .side.menu-open .nav-group{
    background:#121a27!important;
    border-color:#35445b!important;
    margin-bottom:8px!important;
  }

  body.mbb-side-open .side.menu-open .nav-group-head,
  body.mbb-side-open .side.menu-open .nav-group-head *{
    color:#e6edf9!important;
  }

  body.mbb-side-open .side.menu-open .nav button{
    background:#172131!important;
    border-color:#36465e!important;
    color:#f4f7fd!important;
  }

  body.mbb-side-open .side.menu-open .nav button.active,
  body.mbb-side-open .side.menu-open .nav button.on{
    background:#25344a!important;
    border-color:#6f8fbc!important;
    color:#fff!important;
  }

  body.mbb-side-open .side.menu-open .nav small,
  body.mbb-side-open .side.menu-open .company-side{
    color:#bdc9da!important;
  }

  body.mbb-side-open .side.menu-open .no-electronics-menu-control{
    position:relative!important;
    z-index:3!important;
    margin:8px 0 12px!important;
    border-color:#51647e!important;
    background:linear-gradient(145deg,#162235,#101925)!important;
    color:#fff!important;
  }
  body.mbb-side-open .side.menu-open .no-electronics-menu-control b{color:#fff!important;}
  body.mbb-side-open .side.menu-open .no-electronics-menu-control small{color:#c0ccdd!important;}

  body.mbb-side-open:before{z-index:2147482600!important;pointer-events:none!important;}
  #mbbMenuButton{z-index:2147482900!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;}
}

@media (max-width:430px){
  body.mbb-side-open .side.menu-open{
    width:72vw!important;
    max-width:72vw!important;
    padding-top:max(50px,calc(env(safe-area-inset-top) + 44px))!important;
  }
}