fallback and 404

src/routes/weather/compare/[location]/+page.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
+	import { get } from 'svelte/store';
 	import { fade } from 'svelte/transition';
 
-	import { storedLocation } from '$lib/stores/settings';
+	import { storedLocation, storedModel } from '$lib/stores/settings';
 
 	import { ChartContainer, ChartToolbar } from '$lib/components/charts';
 	import { Checkbox } from '$lib/components/ui/checkbox';
@@ -93,6 +94,11 @@
 	// ─── Lifecycle ──────────────────────────────────────────────────────────────
 
 	onMount(() => {
+		// the model chosen elsewhere on the site is always part of the comparison
+		const selectedModel = get(storedModel);
+		if (selectedModel !== 'best_match' && !params.models.includes(selectedModel)) {
+			params.models = [selectedModel, ...params.models];
+		}
 		mounted = true;
 	});
 
@@ -230,7 +236,13 @@
 	</div>
 {/if}
 
-<ChartContainer {loading} chartCount={chartDefs.length || 1} chartHeight={300}>
+<!-- chart count derives from the selected variables (not the fetched data),
+     so the reserved height is right even before the response arrives -->
+<ChartContainer
+	{loading}
+	chartCount={params.hourly?.filter((v) => v !== 'weather_code').length || 1}
+	chartHeight={300}
+>
 	{#if fetchedData}
 		{#each chartDefs as def, i (i)}
 			<CanvasChart