feat(maestro): move mobile ☰ to the main header

The sidebar-drawer toggle now lives left of the logo in the global header
instead of floating over the content area / tab bar. Removes the in-canvas
fab and tab-bar menu button and their styles.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web/src/styles.css

@@ -378,6 +378,25 @@ textarea {
   backdrop-filter: blur(8px);
 }
 
+/* Hamburger to the left of the brand — toggles the off-canvas session drawer.
+   Mobile only (desktop keeps the sidebar permanently in view). */
+.app-menu {
+  display: none;
+  place-items: center;
+  flex: none;
+  width: 32px;
+  height: 32px;
+  border: none;
+  border-radius: var(--r-1);
+  background: transparent;
+  color: var(--ink);
+  font-size: var(--fs-17);
+  cursor: pointer;
+}
+.app-menu:hover {
+  background: var(--surface-2);
+}
+
 /* Three-part header: brand (left), status (centered), actions (right). Equal
    flex on the outer two keeps the status group truly centered. */
 .app-header .brand {
@@ -765,15 +784,6 @@ textarea {
   color: var(--faint);
 }
 
-.folder-count {
-  font-size: var(--fs-11);
-  color: var(--muted);
-  padding: 1px 8px;
-  border-radius: var(--r-pill);
-  background: var(--surface-2);
-  border: 1px solid var(--border);
-}
-
 .tree-leaf {
   display: flex;
   align-items: center;
@@ -2234,9 +2244,6 @@ textarea {
    multi-view mobile (#35): below 860px the split tree projects to a pill strip
    with one pane visible; the sidebar becomes an off-canvas drawer (☰).
    ========================================================================= */
-.mv-mobile-menu {
-  display: none; /* desktop: hidden — the sidebar is always present */
-}
 .mv-backdrop {
   display: none;
 }
@@ -2256,29 +2263,6 @@ textarea {
   border-radius: 0;
   box-shadow: none;
 }
-/* Floating ☰ that replaces the collapsed tab bar, tucked into the header bar. */
-.mv-mobile-fab {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: var(--z-sticky);
-  display: inline-grid;
-  place-items: center;
-  width: 34px;
-  height: var(--bar-h);
-  border: none;
-  background: transparent;
-  color: var(--ink);
-  font-size: var(--fs-15);
-  cursor: pointer;
-}
-/* Make room for the ☰: shift the title (single pane) or pad the pill strip. */
-.mv-mobile-fab + .mv-pane .attach-title {
-  margin-left: 30px;
-}
-.mv-mobile-fab + .mv-panebar {
-  padding-left: 38px;
-}
 .mv-panebar {
   display: flex;
   gap: 4px;
@@ -2319,24 +2303,8 @@ textarea {
 }
 
 @media (max-width: 859px) {
-  /* ☰ lives in the tab bar */
-  .mv-mobile-menu {
+  .app-menu {
     display: inline-grid;
-    place-items: center;
-    align-self: center;
-    width: 28px;
-    height: 28px;
-    margin-right: var(--sp-1);
-    border: none;
-    border-radius: var(--r-1);
-    background: transparent;
-    color: var(--ink);
-    font-size: var(--fs-15);
-    cursor: pointer;
-    flex: none;
-  }
-  .mv-mobile-menu:hover {
-    background: var(--surface-2);
   }
 
   /* sidebar → off-canvas drawer (override the route-based show/hide) */