test(dashboard): add responsive ComparisonStatsCard coverag (JhaSourav07#1750)

## Description
Added a focused test suite for ComparisonStatsCard that checks
responsive layout structure, positive/negative growth indicators, winner
badges, and the zero-value fallback, then verified it passes with
Vitest.

Fixes JhaSourav07#1540 

## Pillar

- [ ] 🎨 Pillar 1 — New Theme Design
- [ ] 📐 Pillar 2 — Geometric SVG Improvement
- [ ] 🕐 Pillar 3 — Timezone Logic Optimization
- [x] 🛠️ Other (Bug fix, refactoring, docs)

## Visual Preview

## Checklist before requesting a review:

- [x] I have read the `CONTRIBUTING.md` file.
- [x] I have tested these changes locally
(`localhost:3000/api/streak?user=YOUR_USERNAME`).
- [x] I have run `npm run format` and `npm run lint` locally and
resolved all errors (CI will fail otherwise).
- [x] My commits follow the Conventional Commits format (e.g.,
`feat(themes): ...`, `fix(calculate): ...`).
- [ ] I have updated `README.md` if I added a new theme or URL
parameter.
- [x] I have started the repo.
- [ ] I have made sure that i have only one commit to merge in this PR.
- [ ] The SVG output matches the CommitPulse "premium quality" aesthetic
standard (no raw elements, smooth animations, correct fonts).
- [x] (Recommended) I joined the CommitPulse Discord community for
contributor discussions, mentorship, and faster PR support.

Author: JhaSourav07

components/dashboard/ComparisonStatsCard.test.tsx

@@ -90,6 +90,7 @@ describe('ComparisonStatsCard', () => {
 
     expect(screen.queryByText('Winner')).toBeNull();
   });
+
   it('renders neutral fallback progress bar when both values are zero', () => {
     const { container } = render(
       <ComparisonStatsCard
@@ -103,7 +104,6 @@ describe('ComparisonStatsCard', () => {
     );
 
     const fallbackBar = container.querySelector('.bg-gray-700\\/50');
-
     expect(fallbackBar).toBeDefined();
   });
 
@@ -225,3 +225,82 @@ describe('ComparisonStatsCard responsive rendering and growth trends (Variation
     expect(screen.getByText('Winner')).toBeDefined();
   });
 });
+
+describe('ComparisonStatsCard responsive breakpoints', () => {
+  it('renders expected card structure with correct HTML nodes', () => {
+    const { container } = render(
+      <ComparisonStatsCard
+        title="Developer Score"
+        valueA={85}
+        valueB={72}
+        labelA="User One"
+        labelB="User Two"
+        icon="Award"
+      />
+    );
+
+    const card = container.firstElementChild;
+    const header = container.querySelector('.flex.justify-between.items-center.mb-6');
+    const comparisonGrid = container.querySelector(
+      '.grid.grid-cols-2.gap-4.items-center.mb-6.relative'
+    );
+    const progressBar = container.querySelector('.w-full.h-2.bg-gray-100');
+    const divider = container.querySelector('.hidden.md\\:block');
+
+    expect(card?.tagName).toBe('DIV');
+    expect(header?.tagName).toBe('DIV');
+    expect(comparisonGrid?.tagName).toBe('DIV');
+    expect(progressBar?.tagName).toBe('DIV');
+    expect(divider?.tagName).toBe('DIV');
+
+    expect(screen.getByText('Winner')).toBeDefined();
+    expect(screen.getByText('85')).toBeDefined();
+    expect(screen.getByText('72')).toBeDefined();
+  });
+
+  it('renders responsive divider and preserves winner badge for higher value', () => {
+    const { container } = render(
+      <ComparisonStatsCard
+        title="Streak"
+        valueA={20}
+        valueB={80}
+        labelA="Alice"
+        labelB="Bob"
+        icon="Flame"
+      />
+    );
+
+    const divider = container.querySelector('.hidden.md\\:block');
+    expect(divider?.tagName).toBe('DIV');
+
+    const winnerBadges = screen.getAllByText('Winner');
+    expect(winnerBadges.length).toBe(1);
+    expect(screen.getByText('80').parentElement?.textContent).toContain('Winner');
+
+    expect(screen.getByText('20').className).not.toMatch(/emerald/);
+
+    expect(screen.getByTitle('Alice')).toBeDefined();
+    expect(screen.getByTitle('Bob')).toBeDefined();
+  });
+
+  it('renders neutral fallback progress bar and no winner badge when both values are zero', () => {
+    const { container } = render(
+      <ComparisonStatsCard
+        title="Commits"
+        valueA={0}
+        valueB={0}
+        labelA="Alice"
+        labelB="Bob"
+        icon="GitCommit"
+      />
+    );
+
+    const progressBar = container.querySelector('.w-full.h-2.bg-gray-100');
+    expect(progressBar?.tagName).toBe('DIV');
+
+    const fallbackBar = container.querySelector('.bg-gray-700\\/50');
+    expect(fallbackBar).toBeDefined();
+
+    expect(screen.queryByText('Winner')).toBeNull();
+  });
+});