refactor(launcher): consolidate menu controls and anchor to bottom

- Combine Extend/Mirror into a single toggle button, moved behind edit_mode
- All edit-mode controls (All Files, All Sessions, Display) now share consistent preset-tonal-tertiary styling
- Remove the always-visible display row and its non-native-mode disclaimer
- Wrap Menu_launcher_controls in mt-auto to keep it pinned to the bottom of the sidebar regardless of session count
- Add min-w-20 to file size chip to prevent collapse on narrow sessions

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

src/routes/events/[event_id]/(launcher)/launcher_file_cont.svelte

@@ -765,7 +765,7 @@ function prevent_default<T extends Event>(fn: (event: T) => void) {
         </span>
 
         <span
-            class="event_file_size preset-filled-surface-100-900 flex w-22 max-w-28 flex-row items-center justify-end gap-1 rounded py-0.5 text-center text-xs"
+            class="event_file_size preset-filled-surface-100-900 flex min-w-20 w-22 max-w-28 flex-row items-center justify-end gap-1 rounded py-0.5 text-center text-xs"
             class:hidden={hide_size}>
             <Save size="0.85em" class="inline" />
             {#if event_file_obj.file_size}{ae_util.format_bytes(

src/routes/events/[event_id]/(launcher)/launcher_menu.svelte

@@ -247,5 +247,7 @@ let ae_promises: key_val = $state({
             bind:trigger_reload__event_session_obj_id />
     {/if}
 
-    <Menu_launcher_controls />
+    <div class="mt-auto w-full">
+        <Menu_launcher_controls />
+    </div>
 </div>

src/routes/events/[event_id]/(launcher)/menu_launcher_controls.svelte

@@ -36,18 +36,22 @@ const is_native_launcher_mode = $derived(
     !!$ae_loc.is_native && $events_loc.launcher.app_mode === 'native'
 );
 
-async function set_quick_display_mode(mode: 'extend' | 'mirror') {
+async function toggle_display_mode() {
-    if (!is_native_launcher_mode) return;
+    const next = quick_display_mode === 'extend' ? 'mirror' : 'extend';
-    const res = await native.set_display_layout({ mode });
+    if (is_native_launcher_mode) {
-    if (res?.success) quick_display_mode = mode;
+        const res = await native.set_display_layout({ mode: next });
+        if (res?.success) quick_display_mode = next;
+    } else {
+        quick_display_mode = next;
+    }
 }
 </script>
 
 <div class="flex w-full max-w-full flex-col items-center justify-center gap-1">
-    <!-- ── Visibility toggles — edit mode only ── -->
+    <!-- ── Edit mode controls ── -->
     {#if $ae_loc.edit_mode}
-        <div
+        <!-- All Files / All Sessions toggles -->
-            class="flex w-full max-w-full flex-row items-center justify-center gap-1">
+        <div class="flex w-full max-w-full flex-row items-center justify-center gap-1">
             <button
                 type="button"
                 onclick={() => {
@@ -59,18 +63,13 @@ async function set_quick_display_mode(mode: 'extend' | 'mirror') {
                         $events_loc.launcher.show_content__internal_files = true;
                     }
                 }}
-                class="
+                class="btn btn-sm preset-tonal-tertiary hover:preset-filled-tertiary-500 w-1/2 max-w-1/2 text-xs transition-all"
-                    btn btn-sm preset-tonal-tertiary
+                title="Toggle visibility of hidden and draft files.">
-                    hover:preset-filled-tertiary-500 w-1/2
-                    max-w-1/2 text-xs
-                    transition-all
-                "
-                title="Toggle visibility of hidden and draft files in the launcher file list.">
                 {#if $events_loc.launcher.show_content__hidden_files}
-                    <EyeOff size="0.85em" class="m-1 text-neutral-800/80" />
+                    <EyeOff size="0.85em" class="m-1" />
                     Hide Files
                 {:else}
-                    <Eye size="0.85em" class="m-1 text-neutral-800/80" />
+                    <Eye size="0.85em" class="m-1" />
                     All Files
                 {/if}
             </button>
@@ -81,27 +80,40 @@ async function set_quick_display_mode(mode: 'extend' | 'mirror') {
                     $events_loc.launcher.show_content__hidden_sessions =
                         !$events_loc.launcher.show_content__hidden_sessions;
                 }}
-                class="
+                class="btn btn-sm preset-tonal-tertiary hover:preset-filled-tertiary-500 w-1/2 max-w-1/2 text-xs transition-all"
-                    btn btn-sm preset-tonal-tertiary
+                title="Toggle visibility of hidden and cancelled sessions.">
-                    hover:preset-filled-tertiary-500 w-1/2
-                    max-w-1/2 text-xs
-                    transition-all
-                "
-                title="Toggle visibility of hidden and cancelled sessions in the launcher session list.">
                 {#if $events_loc.launcher.show_content__hidden_sessions}
-                    <EyeOff size="0.85em" class="m-1 text-neutral-800/80" />
+                    <EyeOff size="0.85em" class="m-1" />
                     Hide Sessions
                 {:else}
-                    <Eye size="0.85em" class="m-1 text-neutral-800/80" />
+                    <Eye size="0.85em" class="m-1" />
                     All Sessions
                 {/if}
             </button>
         </div>
+
+        <!-- Display mode: single toggle button — tertiary when extending (normal), warning when mirroring (special) -->
+        <button
+            type="button"
+            onclick={toggle_display_mode}
+            class="btn btn-sm w-full text-xs transition-all"
+            class:preset-tonal-tertiary={quick_display_mode === 'extend'}
+            class:hover:preset-filled-tertiary-500={quick_display_mode === 'extend'}
+            class:preset-tonal-warning={quick_display_mode === 'mirror'}
+            class:hover:preset-filled-warning-500={quick_display_mode === 'mirror'}
+            title="Toggle display layout between Extend (separate screens) and Mirror (same content on both).">
+            {#if quick_display_mode === 'extend'}
+                <Columns2 size="0.85em" class="m-1" />
+                Display: Extend
+            {:else}
+                <Copy size="0.85em" class="m-1" />
+                Display: Mirror
+            {/if}
+        </button>
     {/if}
 
     <!-- ── Accessibility controls — always visible ── -->
-    <div
+    <div class="flex w-full max-w-full flex-row items-center justify-center gap-1">
-        class="flex w-full max-w-full flex-row items-center justify-center gap-1">
         <!-- Font size cycler: default → larger → smaller → default -->
         <button
             type="button"
@@ -115,29 +127,17 @@ async function set_quick_display_mode(mode: 'extend' | 'mirror') {
                     $ae_loc.font_size_mode = 'default';
                 }
             }}
-            class="
+            class="btn btn-sm preset-tonal-tertiary hover:preset-filled-tertiary-500 group w-1/2 max-w-1/2 text-xs transition-all"
-                btn btn-sm preset-tonal-tertiary
+            title="Cycle font size (default → larger → smaller). Current: {$ae_loc.font_size_mode ?? 'default'}">
-                hover:preset-filled-tertiary-500 group
-                w-1/2 max-w-1/2
-                text-xs transition-all
-            "
-            title="Cycle font size (default → larger → smaller). Current: {$ae_loc.font_size_mode ??
-                'default'}">
             {#if !$ae_loc.font_size_mode || $ae_loc.font_size_mode === 'default'}
-                <span class="m-1 font-mono text-sm leading-none font-bold"
+                <span class="m-1 font-mono text-sm leading-none font-bold">A</span>
-                    >A</span>
+                <span class="hidden text-xs group-hover:inline-block">Font: Normal</span>
-                <span class="hidden text-xs group-hover:inline-block"
-                    >Font: Normal</span>
             {:else if $ae_loc.font_size_mode === 'larger'}
-                <span class="m-1 font-mono text-base leading-none font-bold"
+                <span class="m-1 font-mono text-base leading-none font-bold">A+</span>
-                    >A+</span>
+                <span class="hidden text-xs group-hover:inline-block">Font: Larger</span>
-                <span class="hidden text-xs group-hover:inline-block"
-                    >Font: Larger</span>
             {:else}
-                <span class="m-1 font-mono text-xs leading-none font-bold"
+                <span class="m-1 font-mono text-xs leading-none font-bold">A−</span>
-                    >A−</span>
+                <span class="hidden text-xs group-hover:inline-block">Font: Smaller</span>
-                <span class="hidden text-xs group-hover:inline-block"
-                    >Font: Smaller</span>
             {/if}
         </button>
 
@@ -145,17 +145,10 @@ async function set_quick_display_mode(mode: 'extend' | 'mirror') {
         <button
             type="button"
             onclick={() => {
-                $ae_loc.theme_mode =
+                $ae_loc.theme_mode = $ae_loc.theme_mode === 'dark' ? 'light' : 'dark';
-                    $ae_loc.theme_mode === 'dark' ? 'light' : 'dark';
             }}
-            class="
+            class="btn btn-sm preset-tonal-tertiary hover:preset-filled-tertiary-500 group w-1/2 max-w-1/2 text-xs transition-all"
-                btn btn-sm preset-tonal-tertiary
+            title="Toggle light/dark display mode. Current: {$ae_loc.theme_mode ?? 'light'}">
-                hover:preset-filled-tertiary-500 group
-                w-1/2 max-w-1/2
-                text-xs transition-all
-            "
-            title="Toggle light/dark display mode. Current: {$ae_loc.theme_mode ??
-                'light'}">
             {#if $ae_loc.theme_mode === 'dark'}
                 <Moon class="m-1 inline-block" size="1em" />
                 <span class="hidden group-hover:inline-block">Dark Mode</span>
@@ -165,51 +158,4 @@ async function set_quick_display_mode(mode: 'extend' | 'mirror') {
             {/if}
         </button>
     </div>
-
-    <!-- ── Quick display mode controls — always visible (native-only action) ── -->
-    <div class="flex w-full max-w-full flex-row items-center justify-center gap-1">
-        <button
-            type="button"
-            onclick={() => set_quick_display_mode('extend')}
-            disabled={!is_native_launcher_mode}
-            class="
-                btn btn-sm group w-1/2 max-w-1/2 text-xs transition-all
-                border-2
-            "
-            class:border-primary-500={quick_display_mode === 'extend'}
-            class:preset-tonal-primary={quick_display_mode === 'extend'}
-            class:border-surface-400={quick_display_mode !== 'extend'}
-            class:preset-tonal-surface={quick_display_mode !== 'extend'}
-            title="Set display layout to Extend (separate laptop and projector screens).">
-            <Columns2 size="0.9em" class="m-1 inline-block" />
-            <span class="hidden group-hover:inline-block">Display: Extend</span>
-            <span class="group-hover:hidden">Extend</span>
-        </button>
-
-        <button
-            type="button"
-            onclick={() => set_quick_display_mode('mirror')}
-            disabled={!is_native_launcher_mode}
-            class="
-                btn btn-sm group w-1/2 max-w-1/2 text-xs transition-all
-                border-2
-            "
-            class:border-warning-500={quick_display_mode === 'mirror'}
-            class:preset-tonal-warning={quick_display_mode === 'mirror'}
-            class:border-surface-400={quick_display_mode !== 'mirror'}
-            class:preset-tonal-surface={quick_display_mode !== 'mirror'}
-            title="Set display layout to Mirror (same content on laptop and projector).">
-            <Copy size="0.9em" class="m-1 inline-block" />
-            <span class="hidden group-hover:inline-block">Display: Mirror</span>
-            <span class="group-hover:hidden">Mirror</span>
-        </button>
-    </div>
-
-    {#if !is_native_launcher_mode}
-        <div
-            class="text-[10px] leading-tight opacity-70 text-center px-2"
-            title="Shown here as a visual preview. Active in native app mode in the session room.">
-            Display toggle shown as an example preview. Active in native app mode in the session room.
-        </div>
-    {/if}
 </div>