feat: card highlight system for cross-entity navigation

When clicking a CrossLink, the target entity ID is passed as
?highlight=<id> in the URL. The destination page:
1. Shows a semi-transparent dim overlay (z-index: 10)
2. Finds the card with data-entity-id matching the ID
3. Scrolls to it smoothly (block: center)
4. Applies a pulsing primary-color box-shadow animation (z-index: 11)
5. Cleans up overlay + animation after 2 seconds

If the card isn't in DOM yet (data still loading), a MutationObserver
waits up to 5 seconds for it to appear.

Changes:
- New highlight.ts utility with highlightFromUrl(), MutationObserver,
  dim overlay management
- Card component accepts entityId prop → data-entity-id attribute
- CrossLink accepts entityId prop → appends ?highlight=<id> to href
- All 9 entity pages: Card elements have entityId, highlightFromUrl()
  called after data loads
- CSS: cardHighlight keyframe animation + nav-dim-overlay styles

frontend/src/lib/components/Card.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+	let { children, class: className = '', hover = false, entityId = undefined, ...rest } = $props<{
+		children: import('svelte').Snippet;
+		class?: string;
+		hover?: boolean;
+		entityId?: number | string;
+		[key: string]: any;
+	}>();
+</script>
+
+<div
+	class="card-component {hover ? 'card-hover' : ''} {className}"
+	style="background: var(--color-card); border: 1px solid var(--color-border); border-radius: 0.75rem; padding: 1.25rem;"
+	data-entity-id={entityId}
+	{...rest}
+>
+	{@render children()}
+</div>
+
+<style>
+	.card-component {
+		transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
+	}
+
+	.card-hover:hover {
+		border-color: var(--color-primary);
+		box-shadow: 0 4px 16px var(--color-glow), 0 0 0 1px var(--color-glow);
+		transform: translateY(-2px);
+	}
+</style>

frontend/src/lib/components/CrossLink.svelte

@@ -6,22 +6,30 @@
 		href,
 		icon = 'mdiLink',
 		label,
+		entityId = null,
 		title = '',
 	}: {
 		href: string;
 		icon?: string;
 		label: string;
+		entityId?: number | string | null;
 		title?: string;
 	} = $props();
 
+	const targetHref = $derived(
+		entityId != null
+			? `${href.split('?')[0]}?highlight=${entityId}${href.includes('?') ? '&' + href.split('?')[1] : ''}`
+			: href
+	);
+
 	function navigate(e: MouseEvent) {
 		e.preventDefault();
 		e.stopPropagation();
-		goto(href);
+		goto(targetHref);
 	}
 </script>
 
-<a {href} class="crosslink" title={title || label} onclick={navigate}>
+<a href={targetHref} class="crosslink" title={title || label} onclick={navigate}>
 	<MdiIcon name={icon} size={12} />
 	<span>{label}</span>
 </a>