feat: Add accessible 'Compare markets' modal (#368)

[Sam-Rytech]

Description

This PR introduces an accessible, side-by-side comparison modal for two markets, resolving the UI/UX issue for the GrantFox campaign.

Changes Made

• Created the new app/components/CompareMarketsModal.tsx component which renders a side-by-side comparison of two markets.
• Added comprehensive unit tests in app/components/__tests__/CompareMarketsModal.test.tsx using React Testing Library.
• Leveraged existing UI primitives (Dialog, Badge) for WCAG 2.1 AA accessibility standards.
• Fully implemented dark-mode and design-token consistency by using standard semantic Tailwind tokens (e.g., bg-card, text-card-foreground, text-muted-foreground).

Acceptance Criteria

• Implementation matches the description (side-by-side comparison)
• Tests added
• Responsive across all breakpoints
• WCAG 2.1 AA accessibility guidelines met
• Design-token + dark-mode consistency

Closes #368

[vercel]

@Sam-Rytech is attempting to deploy a commit to the Jagadeesh B's projects Team on Vercel.

A member of the Team first needs to authorize it.

[drips-wave]

@Sam-Rytech Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits