fix: crash on mobile caused by ChartTooltipContent outside ChartContainer

[vltbaudbot]

Problem

The benchmarks app crashes on mobile screens (< 768px) with the ErrorBoundary message:

Something went wrong — We're sorry, but something unexpected happened.

The same crash occurs on desktop when resizing the browser window below 768px.

Root Cause

The mobile chart code paths (introduced in #52) use <ResponsiveContainer> directly instead of <ChartContainer>. However, the tooltip inside them still used <ChartTooltipContent>, which calls useChart() — a hook that requires <ChartContainer>'s React context.

When Recharts renders the tooltip component (even when inactive), useChart() throws:

Error: useChart must be used within a <ChartContainer />

This is caught by the ErrorBoundary, showing the crash screen.

Why it only happens on mobile:

1. useMediaQuery('(max-width: 767px)') initializes as false
2. On small screens, useEffect fires and flips isMobile to true
3. React re-renders into the mobile code path using ResponsiveContainer
4. ChartTooltipContent renders → calls useChart() → throws

Fix

Added a standalone MobileTooltipContent component that provides the same tooltip UI (color indicators, DNF support, formatted values) without depending on useChart()/ChartContext. Replaced the two mobile ChartTooltip usages with Recharts' native <Tooltip> + MobileTooltipContent.

Desktop code paths continue using ChartTooltipContent inside ChartContainer unchanged.

Changes

File	Change
app/src/components/variation/chart.tsx	Add MobileTooltipContent, replace mobile tooltip usage

Build: ✅ tsc -b && vite build clean
Format: ✅ Prettier clean