From d8358048adafa95930c1be2db9b624627f51e332 Mon Sep 17 00:00:00 2001
From: Denis Groshev <denis@halfpixel.ai>
Date: Wed, 28 Oct 2026 16:07:48 +0100
Subject: [PATCH] fix(dock): show only icons on the narrow dock wings so labels
 stop covering the voice control

At 900px and narrower the Location and Visual Presets wings shrink to
--dock-side-compact (4.25rem), open or closed, but their text labels kept
their full width. Between 721px and 900px, where the desktop dock is still
shown, LOCATION and VISUAL PRESETS spilled over the idle voice control, and
the LOCATION label took taps on the left half of the mic button. The label
clip that existed was scoped to 620px, which the phone shell (720px) always
covers, so it never applied to a visible dock.

In that band the labels are now font-size 0 and lose their chevrons, so
each wing shows only its icon. The label text is unchanged, so the toggles'
"Expand/Collapse ..." aria-label and title, which panelChrome builds from
it, keep the full name. The Cyber HUD layout sets a wider
--dock-side-compact that fits its labels, so it keeps them. The
unreachable 620px clip is removed.

Found in GEV launch-readiness QA (HAL-728).
---
 docs/CURRENT-STATE.md                | 14 +++++++++++
 src/ui/styles/command-dock-trays.css | 35 ++++++++++++++++++++++------
 2 files changed, 42 insertions(+), 7 deletions(-)

diff --git a/docs/CURRENT-STATE.md b/docs/CURRENT-STATE.md
index 3e7f333a1..cfa9be32f 100644
--- a/docs/CURRENT-STATE.md
+++ b/docs/CURRENT-STATE.md
@@ -2665,6 +2665,20 @@ isCurrent })` gates BOTH halves of the map-stack switch, which is its only
 >   name the panel (`#location-bar` / `#control-panel`) to reach (2,5,0). Adding
 >   a new tray rule means checking it against the pinned variants, not just
 >   against the base rule.
+> - **Dock wings are icon-only from 900px down to 721px (2026-10-28):** at
+>   ≤900px `--dock-side-compact` shrinks the Location and Visual Presets wings
+>   to 4.25rem, open or closed (an open tray pops out above the dock), which is
+>   too narrow for their text labels. The labels used to spill over the voice
+>   control, and the LOCATION label captured taps on the left half of the mic
+>   button (HAL-728). `src/ui/styles/command-dock-trays.css` now sets the
+>   labels to `font-size: 0` and drops their `›`/`‹` chevrons in that band, so
+>   each wing shows only its icon. The text node is unchanged, so
+>   `panelChrome.js` still builds the toggles' "Expand/Collapse …" `aria-label`
+>   and `title` from it; the browser tooltip is the only visible name on hover.
+>   The Cyber HUD layout is excluded: it sets `--dock-side-compact` to
+>   9–9.75rem, which fits its labels. The former ≤620px ellipsis clip is gone:
+>   the phone shell takes over at 720px, so it never applied to a visible
+>   dock.
 > - **LOCATION mini-status is data-only today (2026-08-20):** the collapsed
 >   readout now follows a free-text geocode search as well as preset pills
 >   (`src/locationStatus.js` owns the copy for both), and every other camera
diff --git a/src/ui/styles/command-dock-trays.css b/src/ui/styles/command-dock-trays.css
index 547037de7..5575b588a 100644
--- a/src/ui/styles/command-dock-trays.css
+++ b/src/ui/styles/command-dock-trays.css
@@ -502,6 +502,34 @@ body:not(.ui-clean-view):not(.recording-mode):has(
   #command-dock .gev-voice-error-tray {
     width: min(24rem, calc(100vw - 1.5rem));
   }
+
+  /* The wings shrink to --dock-side-compact at this width, open or closed (an
+     open tray pops out above the dock), which is too narrow for the text
+     labels; they would spill over the voice control and take its taps. The
+     wings show only their icon; the toggles keep their aria-label. Cyber sets
+     a wider --dock-side-compact that fits its labels, so it keeps them. */
+  :root:not([data-ui-theme='cyber'])
+    #command-dock
+    :is(#location-bar, #control-panel)
+    .panel-title,
+  :root:not([data-ui-theme='cyber'])
+    #command-dock
+    :is(#location-bar, #control-panel)
+    .location-toolbar-label {
+    font-size: 0;
+    letter-spacing: 0;
+  }
+
+  :root:not([data-ui-theme='cyber'])
+    #command-dock
+    :is(#location-bar, #control-panel)
+    .panel-title::after,
+  :root:not([data-ui-theme='cyber'])
+    #command-dock
+    :is(#location-bar, #control-panel)
+    .location-toolbar-label::after {
+    content: none;
+  }
 }
 
 @media (max-width: 620px) {
@@ -510,13 +538,6 @@ body:not(.ui-clean-view):not(.recording-mode):has(
     --dock-voice-width: 8.75rem;
   }
 
-  #command-dock .panel-title,
-  #command-dock .location-toolbar-label {
-    max-width: 2.3rem;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
   #left-panel-stack {
     bottom: calc(50vh + 8px);
   }