/* Logisto shell overrides — layered AFTER the Manifest design package
   (console.css, views.css) so the copied assets stay pristine.

   The prototype shell chrome is desktop-first (console.css has no media
   queries). This adds a minimal mobile treatment so the top bar never forces
   horizontal page overflow: it scrolls within the viewport instead. */

html, body { max-width: 100%; }

@media (max-width: 760px) {
  #app { max-width: 100vw; }
  body { overflow-x: hidden; }

  /* Let the top bar scroll its own content horizontally rather than widening
     the page. All nav items + tools stay reachable by swipe. */
  .topbar {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  .topbar::-webkit-scrollbar { height: 0; }

  .top-spacer { flex: 0 0 6px; }
}