fix(studio): uMind era inusable en móvil

El SPA no tenía ningún tratamiento responsive: un sidebar fijo de 256px
siempre visible. En un teléfono de 375px eso deja 119px para el contenido.

Ahora en móvil el sidebar sale de flujo y entra deslizándose desde la
izquierda, con botón en el header y fondo oscuro para cerrarlo. Se cierra
solo al elegir un tenant: dejarlo abierto tapa justo la pantalla a la que
se acaba de entrar. En escritorio (md+) no cambia nada — sigue fijo y sin
botón.

El estado vive en lib/ui.js porque lo tocan dos componentes que no son
padre/hijo: el botón del header y el propio sidebar.

También se achica el padding del contenido en pantallas chicas y las tabs
del agente pasan a scrollear en su propia caja en vez de desbordar.

Medido a 492px de ancho: scrollWidth igual a innerWidth y ningún elemento
sobresaliendo. Escritorio verificado sin regresión.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

orchestrator/src/App.vue

@@ -1,13 +1,25 @@
 <script setup>
 import Sidebar from './components/Sidebar.vue'
 import { tema, alternarTema } from './lib/tema.js'
+import { menuAbierto } from './lib/ui.js'
 </script>
 
 <template>
   <div class="min-h-screen flex">
     <Sidebar />
     <main class="flex-1 min-w-0 flex flex-col">
-      <header class="h-14 shrink-0 flex items-center justify-end gap-1 px-6 border-b border-borde">
+      <header class="h-14 shrink-0 flex items-center gap-1 px-4 sm:px-6 border-b border-borde">
+        <!-- Solo en móvil: en escritorio el sidebar está siempre visible. -->
+        <button
+          class="btn-ghost !px-2 !py-1.5 md:hidden"
+          aria-label="Abrir menú"
+          @click="menuAbierto = true"
+        >
+          <svg class="w-5 h-5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16" />
+          </svg>
+        </button>
+        <span class="flex-1"></span>
         <button
           class="btn-ghost !px-2.5 !py-1.5"
           :title="tema === 'oscuro' ? 'Cambiar a claro' : 'Cambiar a oscuro'"
@@ -16,7 +28,7 @@ import { tema, alternarTema } from './lib/tema.js'
           <span class="text-base leading-none">{{ tema === 'oscuro' ? '☀️' : '🌙' }}</span>
         </button>
       </header>
-      <div class="flex-1 max-w-5xl w-full mx-auto px-8 py-8 animate-aparecer">
+      <div class="flex-1 max-w-5xl w-full mx-auto px-4 sm:px-6 lg:px-8 py-6 sm:py-8 animate-aparecer">
         <router-view />
       </div>
     </main>