docs(06-02): complete dashboard integration and UX improvements plan

Tasks completed: 2/2
- Task 1: Integrated MobileCarousel into Dashboard
- Task 2: Implemented 5 UX improvements from user feedback
  - Two-line muscle list layout with h-1 progress bar
  - Removed set totals from group headers
  - Merged Forearms into Arms group (6 UI groups)
  - Bilateral muscle highlighting
  - Persistent muscle highlights

SUMMARY: .planning/phases/06-carousel-navigation/06-02-SUMMARY.md

Author: pineapplestrikesback

.planning/STATE.md

@@ -10,19 +10,19 @@ See: .planning/PROJECT.md (updated 2026-01-18)
 ## Current Position
 
 Phase: 6 of 9 (Carousel Navigation)
-Plan: 1 of 2 in current phase
-Status: In progress
-Last activity: 2026-01-22 - Completed 06-01-PLAN.md
+Plan: 2 of 2 in current phase
+Status: Phase complete
+Last activity: 2026-01-22 - Completed 06-02-PLAN.md
 
-Progress: [========..] 75%
+Progress: [==========] 83%
 
 ## Performance Metrics
 
 **Velocity:**
 
-- Total plans completed: 9
-- Average duration: 2.8 min
-- Total execution time: 25 min
+- Total plans completed: 10
+- Average duration: 2.7 min
+- Total execution time: 30 min
 
 **By Phase:**
 
@@ -33,11 +33,11 @@ Progress: [========..] 75%
 | 03-heatmap-core         | 2     | 7 min | 3.5 min  |
 | 04-front-back-toggle    | 1     | 2 min | 2 min    |
 | 05-muscle-list          | 2     | 3 min | 1.5 min  |
-| 06-carousel-navigation  | 1     | 2 min | 2 min    |
+| 06-carousel-navigation  | 2     | 7 min | 3.5 min  |
 
 **Recent Trend:**
 
-- Last 5 plans: 4 min, 2 min, 1 min, 2 min, 2 min
+- Last 5 plans: 2 min, 1 min, 2 min, 2 min, 5 min
 - Trend: Stable (consistently fast on focused plans)
 
 _Updated after each plan completion_
@@ -65,14 +65,17 @@ Recent decisions affecting current work:
 - Combined Task 1 and Task 2 into single atomic commit for 3D flip (toggle button integral to container)
 - Button shows opposite view label ('Back'/'Front') for discoverability (TOGGLE-LABEL)
 - First group starts expanded for mobile muscle list (LIST-MOBILE-01)
-- Use existing 7 UI_MUSCLE_GROUPS for consistency with WeeklyGoalEditor
+- Use existing 6 UI_MUSCLE_GROUPS (Forearms merged into Arms)
 - Progress bar width clamped to 100% (data can exceed but bar fills at max)
-- Group totals replace muscle count badge in headers for actionable info
+- Group totals removed from headers for cleaner UI
 - formatVolume shows whole numbers without decimals, fractions with one decimal
 - embla-carousel-react over custom touch handling for iOS Safari compatibility
 - loop: false for 2-slide carousels (loop breaks with only 2 slides in Embla)
 - touch-pan-y CSS class for vertical scroll compatibility on carousels
 - Elongated active dot (w-4) vs round inactive (w-2) for carousel indicators
+- Two-line muscle list layout (name+ratio, then progress bar) for better readability
+- Bilateral muscle highlighting: tapping one side highlights both left and right
+- Persistent muscle highlights: selection stays until user changes it
 
 ### Patterns Established
 
@@ -101,17 +104,21 @@ Recent decisions affecting current work:
 - **NAV-DOT-01:** Track selected index via emblaApi.on('select') event
 - **NAV-A11Y-01:** aria-label and aria-selected on dot indicators for accessibility
 - **NAV-SCROLL-01:** touch-pan-y class on flex container allows vertical scroll
+- **LIST-MOBILE-02:** Two-line muscle layout with h-1 progress bar spanning full width
+- **LIST-MOBILE-03:** Clean group headers showing only name + chevron
+- **HEAT-BILATERAL-01:** Tapping one side highlights both left and right muscles
+- **HEAT-PERSIST-01:** Selected muscle highlight persists across view flips and until user changes selection
 
 ### Pending Todos
 
 None.
 
 ### Blockers/Concerns
 
-None - Phase 06 Plan 01 complete, carousel ready for integration.
+None - Phase 06 complete with improved mobile UX.
 
 ## Session Continuity
 
-Last session: 2026-01-22T22:19:38Z
-Stopped at: Completed 06-01-PLAN.md
+Last session: 2026-01-22T23:11:00Z
+Stopped at: Completed 06-02-PLAN.md
 Resume file: None

.planning/phases/06-carousel-navigation/06-02-SUMMARY.md

@@ -0,0 +1,148 @@
+---
+phase: 06-carousel-navigation
+plan: 02
+subsystem: ui
+tags: [react, embla-carousel, mobile, ux]
+
+# Dependency graph
+requires:
+  - phase: 06-01
+    provides: MobileCarousel component with swipeable navigation
+provides:
+  - Dashboard with integrated MobileCarousel for mobile users
+  - Two-line muscle list layout with improved readability
+  - Forearms merged into Arms group (6 UI groups instead of 7)
+  - Bilateral persistent muscle highlighting on heatmap
+affects: [mobile-ui, muscle-taxonomy]
+
+# Tech tracking
+tech-stack:
+  added: []
+  patterns:
+    - Two-line muscle list layout (name+ratio on line 1, progress bar on line 2)
+    - Bilateral muscle highlighting (both sides highlight when one tapped)
+    - Persistent selection state (highlights stay until user changes selection)
+
+key-files:
+  created: []
+  modified:
+    - src/ui/pages/Dashboard.tsx
+    - src/ui/components/mobile/MobileMuscleList.tsx
+    - src/ui/components/mobile/MobileHeatmap.tsx
+    - src/core/taxonomy.ts
+
+key-decisions:
+  - "Two-line layout per muscle provides better readability than inline layout"
+  - "Remove set totals from group headers to reduce visual clutter"
+  - "Merge Forearms into Arms group (from 7 to 6 UI groups)"
+  - "Bilateral highlighting ensures users see both left and right muscle activation"
+  - "Persistent highlights stay visible until user changes selection"
+
+patterns-established:
+  - "LIST-MOBILE-02: Two-line muscle layout with h-1 progress bar spanning full width"
+  - "LIST-MOBILE-03: Clean group headers showing only name + chevron"
+  - "HEAT-BILATERAL-01: Tapping one side highlights both left and right muscles"
+  - "HEAT-PERSIST-01: Selected muscle highlight persists across view flips and until user changes selection"
+
+# Metrics
+duration: 5min
+completed: 2026-01-22
+---
+
+# Phase 6 Plan 2: Dashboard Integration Summary
+
+**Mobile carousel with swipeable heatmap/list navigation, improved two-line muscle layout, and bilateral persistent highlighting**
+
+## Performance
+
+- **Duration:** 5 min
+- **Started:** 2026-01-22T23:06:00Z
+- **Completed:** 2026-01-22T23:11:00Z
+- **Tasks:** 2 (1 auto + 1 human-verify checkpoint with 5 UX fixes)
+- **Files modified:** 4
+
+## Accomplishments
+- Dashboard renders MobileCarousel for mobile users (replaces standalone MobileHeatmap)
+- Improved muscle list layout: two lines per muscle (name+ratio, then progress bar)
+- Cleaner group headers: removed set totals, show only name + chevron
+- Simplified taxonomy: merged Forearms into Arms group (6 UI groups)
+- Bilateral muscle highlighting: tapping one side highlights both left and right
+- Persistent highlights: selection stays visible until user changes it
+
+## Task Commits
+
+Each task was committed atomically:
+
+1. **Task 1: Replace MobileHeatmap with MobileCarousel in Dashboard** - `3f0dc3f` (feat)
+2. **Task 2 (checkpoint continuation - 5 UX fixes):**
+   - **Fix 1-3: Muscle list layout improvements** - `a18b834` (fix)
+   - **Fix 4-5: Bilateral persistent highlighting** - `c19adc3` (feat)
+
+**Plan metadata:** (this commit, pending)
+
+## Files Created/Modified
+- `src/ui/pages/Dashboard.tsx` - Integrated MobileCarousel for mobile users
+- `src/ui/components/mobile/MobileMuscleList.tsx` - Two-line layout per muscle, removed group totals
+- `src/core/taxonomy.ts` - Merged Forearms into Arms group, removed Forearms from UIMuscleGroup type
+- `src/ui/components/mobile/MobileHeatmap.tsx` - Added bilateral persistent muscle highlighting with click handlers
+
+## Decisions Made
+
+**1. Two-line muscle list layout**
+- Rationale: User feedback indicated cramped inline layout was hard to read
+- Line 1: Full muscle name (left) + current/target ratio (right)
+- Line 2: 4px tall progress bar spanning full width
+- Improves readability and allows full muscle names without truncation
+
+**2. Remove set totals from group headers**
+- Rationale: Group totals created visual clutter and redundant information
+- Clean headers show only group name + chevron for expand/collapse
+
+**3. Merge Forearms into Arms group**
+- Rationale: Reduced from 7 to 6 UI groups for simpler navigation
+- Anatomically logical: forearms are part of arm musculature
+- Reduces scrolling in muscle list and group selector
+
+**4. Bilateral muscle highlighting**
+- Rationale: User expected both left and right sides to highlight when tapping muscle
+- Implementation: Map muscle clicks to regions, highlight ALL muscles in region (front + back)
+- Uses frequency level 6 with amber color for selected state
+
+**5. Persistent highlights**
+- Rationale: Highlights were disappearing immediately after touch release
+- Solution: State-managed selection that persists until user selects different region or deselects
+- Highlights persist across front/back view flips
+
+## Deviations from Plan
+
+**User-requested UX improvements at checkpoint**
+
+After Task 1 (Dashboard integration), user tested carousel and identified 5 UX issues:
+- Issue 1: Cramped muscle list layout
+- Issue 2: Group header set totals
+- Issue 3: Forearms should be in Arms group
+- Issue 4: Non-bilateral highlighting
+- Issue 5: Highlights disappearing
+
+**Resolution:** Implemented all 5 fixes as part of checkpoint continuation (Task 2). These were not deviations but planned checkpoint feedback integration. The plan explicitly included human verification with user feedback loop.
+
+**Total deviations:** 0 (checkpoint feedback is expected plan flow, not deviation)
+
+## Issues Encountered
+
+None - all implementations worked as expected.
+
+## User Setup Required
+
+None - no external service configuration required.
+
+## Next Phase Readiness
+
+- Mobile carousel navigation complete with improved UX
+- All user feedback addressed
+- Ready for next phase: additional mobile features or analytics enhancements
+- No blockers or concerns
+
+---
+*Phase: 06-carousel-navigation*
+*Completed: 2026-01-22*