cars: brand logos everywhere (search cards, brand grid, model headers), stricter logo matching + curated fixes, logo refresh in cars-photos

src/lib/cars/BrandTile.svelte

@@ -0,0 +1,71 @@
+<script lang="ts">
+	import BrandBadge from './BrandBadge.svelte';
+	import { fmtCompact, type BrandTileData } from './shared.js';
+
+	let { brand, compact = false }: { brand: BrandTileData; compact?: boolean } = $props();
+</script>
+
+<a href="/trackers/cars/{brand.slug}" class={['tile', { compact }]} title={brand.name}>
+	<span class="mark"><BrandBadge name={brand.name} logo={brand.logo} size="xl" /></span>
+	<span class="name">{brand.name}</span>
+	{#if !compact}
+		<span class="meta"
+			>{brand.models}
+			{brand.models === 1 ? 'model' : 'models'}{#if brand.nlCount}
+				· 🇳🇱 {fmtCompact(brand.nlCount)}{/if}</span
+		>
+	{/if}
+</a>
+
+<style>
+	.tile {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 0.45rem;
+		height: 100%;
+		padding: 0.7rem 0.6rem 0.65rem;
+		border: 1px solid var(--site-border);
+		border-radius: 0.9rem;
+		background: var(--site-surface);
+		text-align: center;
+		transition:
+			transform 0.15s,
+			border-color 0.15s,
+			background 0.15s;
+	}
+	.tile:hover,
+	.tile:focus-visible {
+		transform: translateY(-2px);
+		border-color: var(--site-muted);
+		background: var(--site-hover);
+	}
+	.mark {
+		display: grid;
+		place-items: center;
+		width: 100%;
+		aspect-ratio: 16 / 9;
+	}
+	.compact .mark {
+		aspect-ratio: 2 / 1;
+	}
+	.name {
+		max-width: 100%;
+		font-size: 0.85rem;
+		font-weight: 600;
+		line-height: 1.2;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+	.compact .name {
+		font-size: 0.75rem;
+		font-weight: 500;
+		color: var(--site-muted);
+	}
+	.meta {
+		font-size: 0.7rem;
+		color: var(--site-muted);
+		font-variant-numeric: tabular-nums;
+	}
+</style>