feat: improve mobile responsiveness across UI

Sidenav becomes a full-screen overlay on mobile with slide-in animation.
Dialog goes full-screen on small screens. Settings dialog gets a mobile
nav with hamburger menu. Touch targets and text sizes scaled up for
mobile. Slider gets visual checked/unchecked colors. Sidebar auto-closes
on mobile route navigation. Resize handle hidden on mobile.

app/components/Dialog/QuickSwitcher.vue

@@ -116,14 +116,19 @@ onMounted(() => { inputRef.value?.focus(); });
 
 <template>
     <div
-        class="flex flex-col w-[100vw] max-w-4xl max-h-[60vh] bg-[var(--color-bg-elevated)] rounded-xl shadow-2xl border border-[var(--color-border)] overflow-hidden">
+        class="flex flex-col w-[100vw] max-w-4xl md:max-h-[60vh] bg-[var(--color-bg-elevated)] md:rounded-xl shadow-2xl border border-[var(--color-border)] overflow-hidden">
         <!-- Search -->
-        <div class="p-4 border-b border-[var(--color-border)]">
+        <div class="flex p-4 w-full border-b border-[var(--color-border)]">
             <input ref="inputRef" v-model="query" type="text" role="combobox" aria-autocomplete="list"
                 aria-haspopup="listbox" :aria-expanded="flattenedResults.length > 0" :aria-controls="listboxId"
                 :aria-activedescendant="flattenedResults[selectedIndex]?.uiId" placeholder="Search agents and topics..."
                 class="placeholder:text-[var(--text-tertiary)] w-full bg-transparent border-none outline-none text-lg text-[var(--text-primary)]"
                 @keydown="handleKeyDown" />
+            <button
+                class="p-2 flex items-center justify-center md:hidden rounded hover:bg-[var(--color-hover)] text-[var(--text-secondary)] transition-colors"
+                @click="emit('close')">
+                <span class="block i-mynaui-x-solid"></span>
+            </button>
         </div>
 
         <div ref="navRef"