/* Keep category content inside its grid track, including when toolbar search is visible. */
#screen-home .homeToolbar > .subNav,
#screen-catalog #simpleCatalogControls > .subNav {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  justify-self: stretch;
  box-sizing: border-box;
}

/* Give categories and controls separate rows before their combined widths collide. */
@media (max-width: 1100px) {
  #screen-home .homeToolbar,
  #screen-catalog #simpleCatalogControls {
    grid-template-areas: "tabs" "tools";
    grid-template-columns: minmax(0, 1fr);
    row-gap: 12px;
  }
  #screen-home .homeToolbar > .homeTools,
  #screen-catalog #simpleCatalogControls > .homeTools {
    min-width: 0;
    max-width: 100%;
    width: 100%;
  }
}

@media (max-width: 480px) {
  #screen-home .homeToolbar > .homeTools,
  #screen-catalog #simpleCatalogControls > .homeTools {
    grid-template-columns: minmax(0, 1fr);
  }
}