Primary breakpoints

The main mobile shell breakpoint is 900px.

The large layout breakpoint is 1100px for grid-heavy pages.

Auth split pages have dedicated mobile behavior to remove the wrapper only for split layouts.

Mobile rules

Mobile layout changes should preserve usability first.

  • Hide desktop sidebar and show mobile drawer.
  • Keep topbar fixed and compact.
  • Stack grids to one column.
  • Allow tables to scroll inside wrappers, not the body.
  • Do not scale font size with viewport width.
  • Do not let text overlap buttons or cards.