Make the live sessions dock visible

[JayantDevkar]

Problem

The floating live sessions button in the bottom-right corner was hard to see. It was a 62×42 px white pill with the same border as the project cards beneath it, showing only a 13 px icon and a bare count. "A session is waiting on you" was a 9 px dot. On phones the panel was fixed at 400 px, so its left edge was cut off at 390 px.

Changes

• The pill uses inverted colours (dark on the light theme, light on the dark theme), so it never blends into the cards.
• It is 44 px tall and labelled "3 live", with a chevron that flips when open, and a visible focus ring.
• Waiting sessions show as a blue "1 waiting" chip with a pulsing dot. The pulse respects reduced motion.
• The panel width is min(400px, 100vw − 32px), with 16 px insets under 480 px.

Verification

	before	after
Pill size	62×42 px	209×44 px with a waiting session, 112×44 px without
Panel at 390 px	left edge clipped	fits

Screenshots at 1280 and 390 px, light and dark, collapsed and open. svelte-check 0 errors, prettier and eslint clean. Running locally on the production build.

Follow-ups

• The pill can cover the bottom-right of the last card on a page. Needs bottom padding in the layout while the dock shows.
• The terminal buttons in each panel row are about 24 px, below the 44 px tap size.

[JayantDevkar]

Inline context for reviewers, one note per change area.

[JayantDevkar]

Swapping --text-primary and --bg-base inverts the pill in both themes without new tokens. Text contrast is 17.9:1 on light and 15.0:1 on dark.

[JayantDevkar]

--info is the only colour on the pill, so it marks only "blocked on you". Chip text contrast is 6.7:1 on light and 7.3:1 on dark, so it passes AA in both.

[JayantDevkar]

Was a fixed 400 px, which clipped the panel's left edge at 390 px. Desktop is unchanged.