Design a polished analytics dashboard

Responsive KPI cards, a time-series chart, filters and a data table with the states most generated dashboards forget.

Create an analytics dashboard screen in React + Tailwind. UI only, using mock data from a local file.

LAYOUT
- Page header: title, date-range selector (7d / 30d / 90d / custom), export button.
- KPI row: 4 stat cards — value, label, delta versus previous period with direction colour.
- Main chart: time series with two series, legend, tooltip, and a toggle between line and bar.
- Secondary: breakdown by channel as a horizontal bar list with percentages.
- Data table: sortable columns, pagination, 25 rows of mock data, column visibility menu.

STATES TO IMPLEMENT
- Loading skeletons for every card, the chart and the table.
- Empty state when the filter returns nothing.
- Error state with a retry button.

DESIGN
- Neutral palette, one accent colour, subtle 1px borders instead of heavy shadows.
- Numbers use tabular figures and consistent rounding.

ACCEPTANCE CRITERIA
- No layout shift when data loads.
- Chart resizes correctly between 360px and 1440px.
- Table headers are real buttons with aria-sort applied.