Add package comparison feature: CompareBar, ComparisonTable, ComparisonPage

New components for side-by-side funeral package comparison:

- CompareBar molecule: floating bottom pill with fraction badge (1/3, 2/3, 3/3),
  contextual copy, Compare CTA. For ProvidersStep and PackagesStep.
- ComparisonTable organism: CSS Grid comparison with info card, floating verified
  badges, separate section tables (Essentials/Optionals/Extras) with left accent
  borders, row hover, horizontal scroll on narrow desktops, font hierarchy.
- ComparisonPage: WizardLayout wide-form with Share/Print actions. Desktop shows
  ComparisonTable, mobile shows mini-card tab rail + single package card view.
  Recommended package as separate prop (D038).

Also fixes PackageDetail: adds priceLabel pass-through (D039), updates stories
to Essentials/Optionals/Extras section naming (D035).

Decisions: D035-D039 logged. Audits: CompareBar 18/20, ComparisonTable 17/20.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

docs/memory/session-log.md

@@ -26,6 +26,81 @@ Each entry follows this structure:
 
 ## Sessions
 
+### Session 2026-04-07 — Package comparison iteration (Figma-informed)
+
+**Agent(s):** Claude Opus 4.6 (1M context)
+
+**Work completed:**
+- **ComparisonTable major iteration** from Figma feedback:
+  - Dark info card → soft grey info card (surface.subtle, no border), stretches to match card heights, text at top
+  - Provider cards: no logos, floating verified badge (VerifiedOutlinedIcon, consistent with ProviderCard/MiniCard/MapPopup), rating in cards (body2 size)
+  - Separate bordered tables per section (Essentials, Optionals, Extras) with left accent borders (3px brand-500)
+  - Reviews section removed (rating lives in cards)
+  - Horizontal scroll on narrow desktops (minWidth enforcement)
+  - Cards: flex stretch + spacer for CTA bottom-alignment across mixed verified/unverified
+  - Row hover highlight (brand-50), font hierarchy (labels text.secondary, values fontWeight 600)
+- **ComparisonPage iteration:**
+  - Share + Print buttons in page header (onShare, onPrint props)
+  - Mobile verified badge (VerifiedOutlinedIcon in soft brand Badge)
+  - Mobile section headings with left accent borders
+  - Mobile item rows: 60% max-width for names, inline info icons with nowrap binding
+  - Mobile tab rail: mini Card components (provider name + package name) replacing Chips
+  - Navigation included by default in all stories
+- **CompareBar simplified:**
+  - Fraction badge (1/3, 2/3, 3/3)
+  - Contextual copy: "Add another to compare" / "Ready to compare"
+  - Removed package names and remove buttons from pill
+- **Figma integration:**
+  - Created `/capture-to-figma` skill — captures Storybook stories to Parsons Figma file
+  - Created `/figma-ideas` skill — fetches Figma designs and proposes adaptations
+  - Successfully captured ComparisonPage to Figma (node 6041-25005)
+  - Applied user's Figma tweaks (node 6047-25005) back to code
+- **Cleanup:** Removed Figma capture script from preview-head.html, Prettier formatting pass
+
+**Decisions made:**
+- Info card uses surface.subtle (not dark), stretches to match cards — less visually competing
+- Verified badge uses VerifiedOutlinedIcon (consistent with rest of system), floating above cards
+- Rating lives in card headers, no separate Reviews table
+- Section tables separated with left accent borders (3px brand-500)
+- Mobile tab rail uses mini Cards (provider + package name) not Chips
+- Share/Print are optional props on ComparisonPage
+
+**Next steps:**
+- Commit all work
+- Wire CompareBar into PackagesStep/ProvidersStep (state management)
+- Consider comparison state persistence (URL params or context)
+
+---
+
+### Session 2026-04-06b — Package comparison feature
+
+**Agent(s):** Claude Opus 4.6 (1M context)
+
+**Work completed:**
+- **PackageDetail fix (D039):** Added `priceLabel?: string` to `PackageLineItem` interface, passed through to LineItem. Updated stories to use Essentials/Optionals/Extras sections with realistic funeral data (D035). "Complimentary Items" → "Optionals".
+- **CompareBar molecule (new):** Floating comparison basket pill. Fixed bottom, slide-up/down animation. Badge count + provider names + remove × buttons + Compare CTA. Max 3 user packages. Disabled CTA when <2. Inline `role="alert"` error for max-reached. Mobile: compact count + CTA only. Audit: 18/20 (P2s fixed: error visible on mobile, removed redundant aria-disabled).
+- **ComparisonTable organism (new):** CSS Grid side-by-side comparison. Sticky header cards with provider logo/name/location/rating + package name + price + CTA. Row-merged sections via `buildMergedSections` union algorithm. 7 cell value types via discriminated union (D036). Recommended column with warm bg + Badge. Verified → "Make Arrangement", unverified → "Make Enquiry". ARIA `role="table"` + `role="row"` + `role="columnheader"` + `role="cell"`. Desktop only. Audit: 17/20 (P2s fixed: aria-label on recommended column, rowheader on section headings, token-based zebra striping).
+- **ComparisonPage page (new):** WizardLayout (wide-form). Desktop: full ComparisonTable. Mobile: chip tab rail (`role="tablist"`) + single MobilePackageCard (`role="tabpanel"`). Recommended package as separate prop, merged as last column/tab. Back link, help bar.
+- **Stories:** 6 CompareBar stories (Default, SinglePackage, ThreePackages, WithError, Empty, Interactive), 5 ComparisonTable stories (Default, TwoPackages, WithRecommended, MixedVerified, MissingData), 5 ComparisonPage stories (Default, TwoPackages, WithRecommended, MobileView, FullPage with Navigation).
+- **Quality gates:** TypeScript ✓, ESLint ✓, Storybook build ✓. CompareBar audit 18/20, ComparisonTable audit 17/20.
+
+**Decisions made:**
+- D035: Package sections standardised to Essentials/Optionals/Extras
+- D036: ComparisonCellValue uses discriminated union for exhaustive rendering
+- D037: Mobile comparison uses chip tabs + card view, not horizontal scroll table
+- D038: Recommended package is a separate prop, always additional to user selections
+- D039: PackageLineItem gains priceLabel for consistency with LineItem molecule
+
+**Open questions:**
+- None
+
+**Next steps:**
+- Visual review in Storybook (user + Playwright screenshots)
+- Wire CompareBar into PackagesStep (state management for comparison basket)
+- Consider adding CompareBar to WizardLayout as a slot or portal
+
+---
+
 ### Session 2026-04-06 — Retroactive review completion
 
 **Agent(s):** Claude Opus 4.6 (1M context)