Merge PR #122: restore response-viewer eye button on mobile

Remove the dead mobile-collapsed header tray that hid the entire header-right cluster (incl. the opt-in response-viewer eye) on phones/tablets, and update the mobile test to assert inline reachability. Eye stays hidden by default (showResponseViewer).

src/web/public/index.html

@@ -83,7 +83,7 @@
       <!-- Detached single-session window title (shown only in solo mode) -->
       <div class="solo-session-title" id="soloSessionTitle" style="display: none;" aria-live="polite"></div>
 
-      <div class="header-right mobile-collapsed" id="headerRight">
+      <div class="header-right" id="headerRight">
         <button class="btn-icon-header btn-solo-redock" id="soloRedockBtn" style="display: none;" onclick="window.close()" title="Re-dock to dashboard (close window)" aria-label="Re-dock session to dashboard">&#x229E;</button>
         <button class="tunnel-indicator" id="tunnelIndicator" style="display: none;" onclick="app.toggleTunnelPanel()" title="Cloudflare Tunnel" aria-label="Tunnel status">
           <span class="tunnel-dot"></span>

src/web/public/mobile.css

@@ -101,31 +101,12 @@ html.mobile-init .file-browser-panel {
     gap: 0.25rem;
   }
 
+  /* Inline, always-visible header utilities (eye / multimonitor). The
+     position:fixed collapsible tray (02fa3f3) had its expand toggle reverted on
+     master but left this container permanently `mobile-collapsed` → the response
+     viewer eye became unreachable on phones. Restored to the simple inline flow. */
   .header-right {
-    position: fixed;
-    top: calc(52px + var(--safe-area-top));
-    left: calc(0.5rem + var(--safe-area-left));
-    right: auto;
-    display: flex;
-    align-items: center;
     gap: 0.35rem;
-    max-width: calc(100vw - 1rem - var(--safe-area-left) - var(--safe-area-right));
-    padding: 0.35rem;
-    background: rgba(10, 10, 10, 0.96);
-    border: 1px solid rgba(255, 255, 255, 0.12);
-    border-radius: 8px;
-    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
-    overflow-x: auto;
-    scrollbar-width: none;
-    z-index: 2000;
-  }
-
-  .header-right::-webkit-scrollbar {
-    display: none;
-  }
-
-  .header-right.mobile-collapsed {
-    display: none;
   }
 
   .btn-icon-header:not(.btn-sm) {
@@ -435,32 +416,10 @@ html.mobile-init .file-browser-panel {
   }
 
   .header-right {
-    position: fixed;
-    top: calc(40px + var(--safe-area-top));
-    left: calc(0.3rem + var(--safe-area-left));
-    right: auto;
-    display: flex;
-    align-items: center;
     padding-left: 0.2rem;
     gap: 0.1rem;
-    max-width: calc(100vw - 0.6rem - var(--safe-area-left) - var(--safe-area-right));
-    padding: 0.25rem;
-    background: rgba(10, 10, 10, 0.96);
-    border: 1px solid rgba(255, 255, 255, 0.12);
-    border-radius: 8px;
-    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
-    overflow-x: auto;
-    scrollbar-width: none;
+    flex-shrink: 0;
     border-left: none;
-    z-index: 2000;
-  }
-
-  .header-right::-webkit-scrollbar {
-    display: none;
-  }
-
-  .header-right.mobile-collapsed {
-    display: none;
   }
 
   /* Smaller header buttons on mobile */

test/mobile/tabs.test.ts

@@ -132,13 +132,16 @@ describe('Tab Navigation', () => {
       expect(modalClass).toMatch(/active/);
     });
 
-    it('header has no utility toggle and the tray stays collapsed on mobile', async () => {
+    it('header has no utility toggle and the tray is reachable inline on mobile', async () => {
       // The three-dot header utility toggle was removed (owner decision,
-      // 2026-06-10): nothing interactive may occupy the top-left corner, and
-      // the headerRight tray stays collapsed (hidden) on small viewports.
+      // 2026-06-10) and the collapsible position:fixed headerRight tray it
+      // controlled was dropped (PR #122): with the toggle gone, leaving the
+      // tray collapsed made every header-right utility — including the opt-in
+      // response-viewer eye button — permanently unreachable on phones. The
+      // utilities now flow INLINE and must stay reachable on small viewports;
+      // nothing interactive may occupy the top-left corner.
       await page.evaluate(() => {
         document.querySelectorAll('.modal.active').forEach((modal) => modal.classList.remove('active'));
-        document.getElementById('headerRight')?.classList.add('mobile-collapsed');
       });
 
       const toggleCount = await page.locator('#mobileHeaderUtilityToggle').count();
@@ -148,7 +151,7 @@ describe('Tab Navigation', () => {
         const tray = document.getElementById('headerRight');
         return tray ? getComputedStyle(tray).display !== 'none' : false;
       });
-      expect(trayVisible).toBe(false);
+      expect(trayVisible).toBe(true);
     });
 
     it('tabs remain visible on large phone and tablet headers', async () => {