games: official logos for all 16 game trackers (self-hosted, one map in #lib/game-logos) shown by TrackerIcon everywhere games appear; coloured tile stays as fallback; logo credits on the artwork credits page

src/routes/projects/game-tracker/credits/+page.svelte

@@ -1,5 +1,8 @@
 <script lang="ts">
 	import { resolve } from '$app/paths';
+	import TrackerIcon from '#lib/components/TrackerIcon.svelte';
+	import { gameLogos } from '#lib/game-logos.js';
+	import { gameTrackers } from '#lib/projects.js';
 	import type { PageProps } from './$types';
 	let { data }: PageProps = $props();
 </script>
@@ -16,6 +19,23 @@
 		stores WebP copies for consistent, reliable display. Map imagery is shared across games in the
 		same region; later-region landmark positions are approximate.
 	</p>
+	<h2 class="mt-8 text-xl font-semibold">Game logos</h2>
+	<ul class="mt-4 grid gap-3 sm:grid-cols-2">
+		{#each gameTrackers as game (game.href)}
+			{@const logo = gameLogos[game.icon ?? game.name]}
+			{#if logo}
+				<li class="flex items-center gap-3">
+					<TrackerIcon name={game.icon ?? game.name} class="size-8" />
+					<div class="min-w-0">
+						<p class="text-sm font-medium">{game.name}</p>
+						<a href={logo.source} target="_blank" rel="noreferrer" class="text-xs underline"
+							>{logo.credit}</a
+						>
+					</div>
+				</li>
+			{/if}
+		{/each}
+	</ul>
 	<h2 class="mt-8 text-xl font-semibold">Regional maps</h2>
 	<ul class="mt-4 space-y-3">
 		{#each data.maps as map (map.name)}<li>