layout shifts

src/lib/components/navigation/footer.svelte

@@ -1,6 +1,8 @@
 <script lang="ts">
 	import { resolve } from '$app/paths';
 
+	import LogoMark from './logo-mark.svelte';
+
 	// A hand-picked set of the prerendered city pages (see
 	// routes/weather/locations/city-names100.json) — instant navigation targets
 	// that double as SEO entry points.
@@ -37,9 +39,11 @@
 			<!-- Brand -->
 			<div class="max-w-xs">
 				<div class="flex items-center gap-2">
-					<span class="flex h-8 w-8 items-center justify-center rounded-lg bg-primary text-lg"
-						>☔</span
+					<span
+						class="flex h-8 w-8 items-center justify-center rounded-lg bg-primary text-primary-foreground"
 					>
+						<LogoMark />
+					</span>
 					<span class="text-lg font-bold tracking-tight">Drizz.li</span>
 				</div>
 				<p class="mt-3 text-sm leading-relaxed text-muted-foreground">