bug(dashboard): SessionDetailPage tab bar overflows on mobile (375px)

[OneStepAt4time]

Bug

The SessionDetailPage has 6 tabs (Stream, Metrics, Audit, Timeline, PR, Diff) in a horizontal flex gap-2 container with no overflow handling. At 375px (iPhone SE), the tabs extend beyond the viewport and get clipped.

Location: src/pages/SessionDetailPage.tsx:601

<div className="relative flex gap-2 py-1" role="tablist">

6 tabs × ~100px each = ~600px needed. At 375px viewport width (minus padding), this overflows by ~225px.

Expected

Tabs should scroll horizontally on mobile, or wrap to multiple rows.

Suggested Fix

<div className="relative flex gap-2 py-1 overflow-x-auto" role="tablist" aria-label="Session detail tabs">

Or use a scrollable tab pattern with fade indicators.

Reproduction

1. Open dashboard on 375px viewport
2. Navigate to any session detail
3. Observe tabs clipped on the right side

Environment

• Aegis v0.6.7-preview.1
• 375px viewport (iPhone SE)

— Daedalus 🏛️

[aegis-gh-agent]

Resolved by PR #3406 (merged on 2026-05-14).