提示
圆环颜色承担语义：红是消耗、绿是锻炼、青是站立。数字要大，判断要小。
Build a fitness tracker dashboard for "Pulse", a personal health app.
STYLE
- Light grey canvas (#f2f2f7), white rounded cards with soft shadows
- Apple-Fitness ring colours: Move #fa114f, Exercise #92e82a, Stand #1eeaef; amber streak accent
- Friendly rounded sans, tabular numerals
LAYOUT
- Header: "Today" + date "Tue, Sep 9" + a "12-day streak" amber pill
- Left: three activity rings - Move 512/600 (red), Exercise 28/30 (green), Stand 10/12 (cyan) - with a colour-dot legend
- Right: 2x2 stat chips (Steps 12,482 / Distance 8.4 km / Calories 612 / Active 48 min) and a "This week" bar chart with today highlighted red
- Tall only: "Recent workouts" rows - Morning run (Run chip, 5.2 km - 28 min, 5'23"/km), Evening ride (Ride chip, 18.6 km - 62 min, 18.0 km/h), Recovery flow (Yoga chip, 26 min - Low HR, 104 bpm)
COMPONENTS
- Header: Today, date, streak pill
- Activity rings with a colour-dot legend (Move / Exercise / Stand)
- Stat chips: steps, distance, calories, active minutes
- Weekly bar chart with today highlighted; workout rows with type chips
INTERACTION
- Rings sweep to value on view; today's bar is pre-highlighted; workout chips carry type colour.
TECHNICAL
- React, Tailwind CSS, Recharts, shadcn/ui