web: a knob's ruler stands in the strip's slot, and a sub-chip is its name again

The strip a chip opened kept a row of its own while a knob's ruler opened over
it, so WB's COLOR TEMP put the panel on the screen twice — the rows in the strip
and the panel under them — and charged the photo a row for the saying. The path
under the bar (.crumb) already names the panel the ruler came from and is one tap
from its strip, so the ruler now stands in the strip's slot and the strip stands
down with the bar: on 390x844 LIGHT's WB strip is 42px and the photo 639px,
COLOR TEMP's ruler 60px and the photo 621px, the path TABS > LIGHT > WB >
COLOR TEMP walking back to the strip and then to the bar.

A sub-chip also wore the initials of its own label on a tile over it — COLOR TEMP
as CT, PRO NEG HI as PNH — which is the name the pill already prints, spelled
twice and set 60px tall: LIGHT's WB strip measured 73px on that tile, 42px as the
name alone. The ruler's own "<" goes with them: the path names the strip it would
reopen, and a wide screen draws neither the path nor a ruler in the bar.

Checks:
- npm run build (tsc --noEmit + vite) clean: dist/assets/index-2IP_1LL_.css
  71.42 kB.
- Chromium 390x844, light and dark, LIGHT: the bar 40px / the photo 641px; WB
  open, the bar gone and its strip 42px in the slot, the photo 639px; COLOR TEMP's
  ruler 60px in that slot, the photo 621px, the path TABS > LIGHT > WB >
  COLOR TEMP; crumb-strip lands back on the WB strip and crumb-tab on the bar at
  641px. No page error and no sideways scroll (390px of 390px) in any state; on
  1280x900 .dev-panels is painted and .dev-chips/.crumb are not.

docker/frontend/src/App.tsx

@@ -3108,17 +3108,6 @@ export function Workspace() {
     ...(masks.length ? [{ key: 'masks-clear', label: 'CLEAR', onClick: clearMasks }] : []),
   ];
 
-  // The mark a sub-chip wears on its tile on a phone (see .chip-icon and
-  // .col-sub .chip in app.css): the initials of a phrase — COLOR TEMP -> CT,
-  // PRO NEG HI -> PNH — and the opening letter of a single word. A table of
-  // hand-picked glyphs for every option the app owns would be a second set of
-  // names to keep, and the name under the mark is already there to read.
-  const chipIcon = (d: string): string => {
-    const words = d.split(/\s+/).filter(Boolean);
-    return words.length > 1 ? words.map((w) => w[0]).join('').slice(0, 3).toUpperCase() : d[0].toUpperCase();
-  };
-  const withIcon = (c: ChipDef): ChipDef => (c.divider || c.disabled ? c : { ...c, icon: chipIcon(c.label) });
-
   // A find alone does not narrow its argument: the guard is what tells the rest
   // of the function that g is a panel key and not a group's.
   const isDevPanel = (k: StripKey): k is DevPanel => DEV_PANELS.some((p) => p.key === k);
@@ -3126,8 +3115,8 @@ export function Workspace() {
   const stripChips = (g: Exclude<StripKey, 'wm'>): ChipDef[] => {
     // The two tool strips hold chips that arm the pointer rather than options to
     // pick, so groupDefs has nothing to say about them.
-    if (g === 'fix') return fixChips.map(withIcon);
-    if (g === 'gradient') return gradientChips.map(withIcon);
+    if (g === 'fix') return fixChips;
+    if (g === 'gradient') return gradientChips;
     // LIGHT's four panels: the panel's rows first — each a knob that opens its
     // ruler above — then the picks that close it, because a panel is read as its
     // rows and the picks its name is about.
@@ -3162,7 +3151,7 @@ export function Workspace() {
         ...(g === 'effects'
           ? choiceChips('dr', DR_OPTIONS, String(recipe.adjustments.dynamicRange ?? 'auto'), groupDefs.dr.onPick)
           : []),
-      ].map(withIcon);
+      ];
     }
     const out: ChipDef[] = [
     { key: `hint-${g}`, label: groupDefs[g].label, disabled: true, onClick: () => {} },
@@ -3219,7 +3208,7 @@ export function Workspace() {
         ]
       : []),
     ];
-    return out.map(withIcon);
+    return out;
   };
 
   // RECIPES = this account's own files (SAVE RECENT) + what this session made