refactor(dashboard): adopt Card primitive in DashboardFamilyPulse (§7)

Refs #858
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/lib/shared/dashboard/DashboardFamilyPulse.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 import * as m from '$lib/paraglide/messages.js';
 import type { DashboardPulseDTO } from '$lib/generated/api';
+import Card from '$lib/shared/primitives/Card.svelte';
 
 interface Props {
 	pulse: DashboardPulseDTO | null;
@@ -10,11 +11,13 @@ const { pulse }: Props = $props();
 </script>
 
 {#if pulse !== null}
-	<section class="rounded-sm border border-line bg-surface p-5">
-		<p class="font-sans text-[11px] font-bold tracking-[.12em] text-ink-3 uppercase">
-			{m.pulse_eyebrow()}
-		</p>
-
+	<!--
+		Card adoption (issue #858): DashboardFamilyPulse is now rendered inside the
+		shared Card primitive so it inherits the 3px mint top accent, semantic tokens,
+		and the section-caption helper. The caption text is the Paraglide key
+		m.pulse_eyebrow() — adopter responsibility per the safe-rendering contract.
+	-->
+	<Card padding="sm" accent="top" caption={m.pulse_eyebrow()}>
 		{#if pulse.pages > 0}
 			<h2 class="mt-1 font-serif text-[1.375rem] leading-snug text-ink">
 				{m.pulse_headline({ pages: pulse.pages })}
@@ -66,5 +69,5 @@ const { pulse }: Props = $props();
 				</span>
 			</div>
 		</div>
-	</section>
+	</Card>
 {/if}

frontend/src/lib/shared/dashboard/DashboardFamilyPulse.svelte.test.ts

@@ -20,7 +20,8 @@ describe('DashboardFamilyPulse', () => {
 	it('renders nothing when pulse is null', async () => {
 		render(DashboardFamilyPulse, { props: { pulse: null } });
 
-		expect(document.querySelector('section')).toBeNull();
+		// Component now renders via Card primitive (div, not section)
+		expect(document.querySelector('[data-testid="card"]')).toBeNull();
 	});
 
 	it('renders the eyebrow when pulse is not null', async () => {
@@ -29,10 +30,12 @@ describe('DashboardFamilyPulse', () => {
 		await expect.element(page.getByText('Diese Woche')).toBeVisible();
 	});
 
-	it('hides the headline when pages is 0', async () => {
+	it('hides the pulse headline when pages is 0', async () => {
 		render(DashboardFamilyPulse, { props: { pulse: basePulse({ pages: 0 }) } });
 
-		await expect.element(page.getByRole('heading')).not.toBeInTheDocument();
+		// The Card caption is always rendered as an h2; check the pulse headline (h2 inside Card children)
+		// specifically by its text content — it should not appear when pages is 0
+		await expect.element(page.getByText(/Seiten bearbeitet/)).not.toBeInTheDocument();
 	});
 
 	it('renders the headline when pages > 0', async () => {