feat(home): open-tab column on the desktop home screen; bigger phone home button

The welcome overlay centers ~560px of content in a ~1400px window, so both
gutters are dead space. The left one now carries the open tabs as a vertical
list (home-sessions.js): one row per live session plus saved web tabs, in TAB
order rather than by urgency, because the row badges are the Alt+1..9 indices.
Clicking a row enters that session.

Working state is deliberately the phone's, exactly: a pulsing green dot ringed
by the same tab-load-spin the tab strip uses while a tab loads, now with a green
halo added on both surfaces so "working" reads identically wherever you see it.

The column is position:absolute so the centered content never moves, which is
why it needs a width gate in two places (HOME_SESSIONS_MIN_WIDTH = 1180 in JS,
a max-width: 1179px media query as the backstop for a resize that outruns the
matchMedia listener). A test pins the two equal. State classification is reused
from mobile-overview.js rather than re-derived, so the two home screens cannot
disagree about what counts as needing you.

Phones keep the mobile overview, and their brand "C" was a 0.85rem inline span,
roughly a 12x13px target on the one control that gets you back to that screen.
It is now a 44px-wide button filling the full header height, with the glyph
scaled to match. 44 is horizontal only: the phone header is pinned to 36px and
clips overflow, so a true 44x44 would mean taking height off the terminal.

Verified end to end against a real isolated instance (own tmux socket + data
dir): 18 browser checks covering render, live update through the tab renderer,
the working dot's animation/glow/ring, row click, the narrow-window gate, the
phone fallback, and a real touch tap on the far corner of the new hit box.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

test/mobile-header-buttons-policy.test.ts

@@ -143,3 +143,35 @@ describe('Mobile header button policy (static guard)', () => {
     }
   });
 });
+
+// The flip side of the policy above: the ONE header control phones do keep has
+// to be pressable. The brand "C" is the way back to the home screen and was a
+// 0.85rem inline span — roughly a 12x13px target, well under the 44px minimum.
+describe('Phone home button tap target (static guard)', () => {
+  const css = readFileSync(join(PUBLIC, 'mobile.css'), 'utf-8');
+
+  /** Declarations applying to `.header-brand .logo` inside a phone media query. */
+  function phoneLogoDecls(): Map<string, string> {
+    const decls = new Map<string, string>();
+    postcss.parse(css).walkAtRules('media', (atRule) => {
+      if (!appliesToPhone(atRule.params)) return;
+      atRule.walkRules((rule) => {
+        if (!/\.header-brand\s+\.logo\s*$/.test(rule.selector)) return;
+        rule.walkDecls((decl) => decls.set(decl.prop, decl.value));
+      });
+    });
+    return decls;
+  }
+
+  it('gives the brand button a 44px-wide hit area on phones', () => {
+    const decls = phoneLogoDecls();
+    expect(decls.get('min-width'), 'the "C" home button needs an explicit 44px min-width on phones').toBe('44px');
+    // A bare inline span ignores width entirely — the box only exists once it
+    // stops being inline.
+    expect(decls.get('display')).toBe('inline-flex');
+    // Full header height on the short axis: the phone header is pinned to 36px
+    // (min/max-height) and clips overflow, so this is as tall as the target can
+    // get without growing the header and taking it off the terminal.
+    expect(decls.get('height')).toBe('var(--header-height)');
+  });
+});