/* v36: canonical drawer and category layout. This intentionally overrides the
   legacy mobile/flex rules instead of adding another breakpoint variation. */
#drawer:not(.search-hidden):not(.mobile-collapsed){
  box-sizing:border-box!important;
  left:18px!important;
  right:auto!important;
  top:92px!important;
  bottom:18px!important;
  width:min(520px,calc(100vw - 36px))!important;
  max-width:520px!important;
  height:auto!important;
  max-height:calc(100vh - 110px)!important;
  overflow:hidden!important;
}
#drawer #filters{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  gap:8px!important;
  flex:none!important;
  align-content:start!important;
  width:auto!important;
  max-height:none!important;
  overflow:visible!important;
}
#drawer #filters > button{
  grid-column:auto!important;
  grid-row:auto!important;
  flex:none!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  white-space:normal!important;
  line-height:1.1!important;
}
@media (min-width:641px) and (max-width:900px){
  #drawer:not(.search-hidden):not(.mobile-collapsed){
    left:8px!important;
    right:auto!important;
    top:92px!important;
    bottom:8px!important;
    width:min(520px,calc(100vw - 16px))!important;
    max-width:520px!important;
    max-height:calc(100vh - 100px)!important;
    height:auto!important;
    border-radius:0!important;
  }
}
@media (max-width:640px){
  #drawer:not(.search-hidden):not(.mobile-collapsed){
    left:8px!important;
    right:8px!important;
    top:72px!important;
    bottom:auto!important;
    width:calc(100vw - 16px)!important;
    max-width:none!important;
    height:min(78dvh,700px)!important;
    max-height:calc(100dvh - 94px)!important;
    border-radius:10px!important;
  }
  #drawer.mobile-collapsed{height:54px!important;max-height:54px!important;overflow:hidden!important}
}
