Fix search priority:

1. Match to exact CRS
 2. Match to exact Name
 3. Match to 'Name startsWith'
 4. Match any with valid CRS
 5. Match alphabetically

src/lib/components/ui/Button.svelte

@@ -59,10 +59,10 @@
 		height: 36px;
 		border-radius: 20px;
 		border: none;
-		box-shadow: var(--shadow-std);
+		box-shadow: var(--shadow-small);
 		font-family: 'URW Gothic', sans-serif;
 		font-size: 0.93rem;
-		font-weight: 600;
+		font-weight: 400;
 		letter-spacing: 0.05ch;
 		transition:
 			all 0.1s ease,
@@ -72,6 +72,7 @@
 	.accent {
 		background-color: var(--color-accent);
 		color: var(--color-title);
+		font-weight: 600;
 	}
 
 	.brand {

src/lib/components/ui/LocationSearchBox.svelte

@@ -33,9 +33,21 @@
 				if (aExactCrs && !bExactCrs) return -1;
 				if (!aExactCrs && bExactCrs) return 1;
 
-				// Priority Two - 'Stations' with CRS
+				// Priority Two - Exact Name Match
+				const aNameLow = a.n.toLowerCase();
+				const bNameLow = b.n.toLowerCase();
+				const aExactName = aNameLow === lowerQuery;
+				const bExactName = bNameLow === lowerQuery;
+				if (aExactName !== bExactName) return aExactName ? -1 : 1;
+
+				// Priority Three - Name starts with Query
+				const aStarts = aNameLow.startsWith(lowerQuery);
+				const bStarts = bNameLow.startsWith(lowerQuery);
+				if (aStarts !== bStarts) return aStarts ? -1 : 1;
+
+				// Priority Four - 'Stations' with CRS
 				if (!!a.c && !b.c) return -1;
-				if (!a.c & !!b.c) return 1;
+				if (!a.c && !!b.c) return 1;
 
 				// Alphabetical Sort
 				return a.n.localeCompare(b.n);

src/lib/components/ui/TimezoneWarning.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+    import { slide } from 'svelte/transition';
+
+	let isNotLondon = $state(false);
+	let londonZone = $state('Greenwich Mean Time');
+
+	onMount(() => {
+		const userTZ = Intl.DateTimeFormat().resolvedOptions().timeZone;
+		isNotLondon = userTZ !== 'Europe/London';
+
+		const parts = new Intl.DateTimeFormat('en-GB', {
+			timeZone: 'Europe/London',
+			timeZoneName: 'long'
+		}).formatToParts(new Date());
+
+		londonZone = parts.find((p) => p.type === 'timeZoneName')?.value || 'UK Time';
+	});
+</script>
+
+{#if isNotLondon}
+	<div transition:slide={{duration: 300}} class="tzWarn"><p class="tzText">
+		All times are shown in <strong>{londonZone}</strong>
+    </p></div>
+{/if}
+
+<style>
+    .tzWarn {
+        display: flex;
+        justify-content: center;
+        width: 100%;
+        padding: 1rem 0 0 0;
+    }
+
+    .tzText {
+        width: 80%;
+        text-align: center;
+        margin: auto;
+        font-family: 'URW Gothic', sans-serif;
+        font-size: 1.2rem;
+    }
+</style>

src/lib/global.css

@@ -55,6 +55,7 @@
 	/* Shadows */
 	--color-shadow: hsla(210, 20%, 5%, 0.35);
 	--shadow-std: 0 4px 12px var(--color-shadow);
+	--shadow-small: 0 4px 6px var(--color-shadow);
 	--shadow-up: 0 -4px 12px var(--color-shadow);
 	--shadow-right: 4px 0 12px var(--color-shadow);
 }

src/routes/+layout.svelte

@@ -6,6 +6,8 @@
 	import { LOCATIONS } from '$lib/locations-object.svelte';
 	import { nearestStationsState } from '$lib/geohash.svelte';
 
+	import TimezoneWarning from '$lib/components/ui/TimezoneWarning.svelte';
+
 	import '$lib/global.css';
 
 	import logoText from '$lib/assets/round-logo-text.svg';
@@ -78,6 +80,7 @@
 </header>
 
 <main>
+	<TimezoneWarning />
 	{@render children()}
 </main>