MC-4736

Mobile Tasks page responsive layout regression from Telegram screenshot `/home/lucienne/.hermes/image_cache/img_cadc9e822c1c.jpg`. Observed on narrow Android viewport: - Task status tab row is horizontally clipped: left side of `Running 0` is cut off; right edge shows another control/card peeking offscreen. - Filter row likely overflows: `Profile: all` and `Sort: Last Run` fit, but a third control is partially clipped on the right. - Blue circular arrow appears wedged between tabs and makes the state selector confusing on mobile. - Top action buttons (`Health`, `Reap stale runs`) have awkward spacing/alignment on mobile. - Lower `Run history` card appears cramped/partially obscured by sticky bottom navigation; verify safe-area/bottom padding. Likely root causes: - fixed/min widths in filter/status rows, - flex rows missing wrap/stack behavior or `min-width: 0`, - desktop spacing reused on mobile, - sticky bottom nav not accounted for in page padding. Acceptance criteria: - At 320/360/390/412px widths, no primary Tasks page controls are clipped offscreen on initial render. - Filter controls wrap or stack cleanly on mobile. - Task status tabs are readable/tappable; if horizontal scrolling is intentional, the initial scroll position shows the first item fully and the affordance is clear. - Content is not hidden behind the bottom nav; safe-area/bottom padding is correct. - Add Playwright/mobile visual or layout regression coverage for the Tasks page: no unintended horizontal document scroll, key controls fully within viewport, bottom card visible above nav. Expected check-in: within 2 hours.