diff --git a/package-lock.json b/package-lock.json
index fe2e2ce..017c961 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,9 +8,8 @@
 			"name": "web-pwa",
 			"version": "0.0.1",
 			"dependencies": {
-				"@owlboard/api-schema-types": "^3.0.3-alpha18",
-				"@owlboard/owlboard-ts": "^3.0.0-dev.20260509t2101",
-				"@tabler/icons-svelte": "^3.40.0"
+				"@owlboard/api-schema-types": "^3.0.3-alpha19",
+				"@owlboard/owlboard-ts": "^3.0.0-dev.20260509t2101"
 			},
 			"devDependencies": {
 				"@eslint/compat": "^2.0.2",
@@ -19,6 +18,7 @@
 				"@sveltejs/adapter-static": "^3.0.10",
 				"@sveltejs/kit": "^2.50.2",
 				"@sveltejs/vite-plugin-svelte": "^6.2.4",
+				"@tabler/icons-svelte-runes": "^3.44.0",
 				"@types/node": "^22",
 				"@vitest/browser-playwright": "^4.0.18",
 				"eslint": "^9.39.2",
@@ -760,6 +760,7 @@
 			"version": "0.3.13",
 			"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
 			"integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@jridgewell/sourcemap-codec": "^1.5.0",
@@ -770,6 +771,7 @@
 			"version": "2.3.5",
 			"resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
 			"integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@jridgewell/gen-mapping": "^0.3.5",
@@ -780,6 +782,7 @@
 			"version": "3.1.2",
 			"resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
 			"integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+			"dev": true,
 			"license": "MIT",
 			"engines": {
 				"node": ">=6.0.0"
@@ -789,12 +792,14 @@
 			"version": "1.5.5",
 			"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
 			"integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
+			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/@jridgewell/trace-mapping": {
 			"version": "0.3.31",
 			"resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
 			"integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@jridgewell/resolve-uri": "^3.1.0",
@@ -802,9 +807,9 @@
 			}
 		},
 		"node_modules/@owlboard/api-schema-types": {
-			"version": "3.0.3-alpha18",
-			"resolved": "https://git.fjla.uk/api/packages/OwlBoard/npm/%40owlboard%2Fapi-schema-types/-/3.0.3-alpha18/api-schema-types-3.0.3-alpha18.tgz",
-			"integrity": "sha512-k9X83i8ljatuiKQWNxgixid8tneM0i0G5NP1Wo1N2O0SF0PBMs3gxkEMWwKMuc+htiGCeRLqvIZqrm//Bgeo/w==",
+			"version": "3.0.3-alpha19",
+			"resolved": "https://git.fjla.uk/api/packages/OwlBoard/npm/%40owlboard%2Fapi-schema-types/-/3.0.3-alpha19/api-schema-types-3.0.3-alpha19.tgz",
+			"integrity": "sha512-dVtJAw1p1SLsv9nEojUaku1BPPJnypoX5ZOoONboN8fh81kqGM16OVR69GEHhwuPgJDaPLDUSBxtYYAKZ6ZTcQ==",
 			"license": "MIT"
 		},
 		"node_modules/@owlboard/owlboard-ts": {
@@ -1203,6 +1208,7 @@
 			"version": "1.0.9",
 			"resolved": "https://registry.npmjs.org/@sveltejs/acorn-typescript/-/acorn-typescript-1.0.9.tgz",
 			"integrity": "sha512-lVJX6qEgs/4DOcRTpo56tmKzVPtoWAaVbL4hfO7t7NVwl9AAXzQR6cihesW1BmNMPl+bK6dreu2sOKBP2Q9CIA==",
+			"dev": true,
 			"license": "MIT",
 			"peerDependencies": {
 				"acorn": "^8.9.0"
@@ -1219,9 +1225,9 @@
 			}
 		},
 		"node_modules/@sveltejs/kit": {
-			"version": "2.59.1",
-			"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.59.1.tgz",
-			"integrity": "sha512-d8OON70AphLdDesuTIl//M2O6fRTIicX8aYv8vhCiYEhTTI2OboKqey0Hu1A4VFhqwgqtq0vKDmPFGkw8kKmgw==",
+			"version": "2.60.1",
+			"resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.60.1.tgz",
+			"integrity": "sha512-mQjlkNo+rJvpln7V2IGY2j99BqhcFbS4UN0AQNKNYfhBAFZTuCDAdW3a1sgf330mvtNvsBXn3HpAhcmvdJTcIQ==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -1230,7 +1236,7 @@
 				"@types/cookie": "^0.6.0",
 				"acorn": "^8.14.1",
 				"cookie": "^0.6.0",
-				"devalue": "^5.6.4",
+				"devalue": "^5.8.1",
 				"esm-env": "^1.2.2",
 				"kleur": "^4.1.5",
 				"magic-string": "^0.30.5",
@@ -1303,16 +1309,18 @@
 			"version": "3.44.0",
 			"resolved": "https://registry.npmjs.org/@tabler/icons/-/icons-3.44.0.tgz",
 			"integrity": "sha512-Wn0AOZG9sg0L+bjfMqq4eNhC6pQjIrk94LvvWYNYkY8KH8wC3YILRzQlrnVJc4FUeMxH/AK97QsYCX35H3LndA==",
+			"dev": true,
 			"license": "MIT",
 			"funding": {
 				"type": "github",
 				"url": "https://github.com/sponsors/codecalm"
 			}
 		},
-		"node_modules/@tabler/icons-svelte": {
+		"node_modules/@tabler/icons-svelte-runes": {
 			"version": "3.44.0",
-			"resolved": "https://registry.npmjs.org/@tabler/icons-svelte/-/icons-svelte-3.44.0.tgz",
-			"integrity": "sha512-ZJJMCHoqpvb9hLVn9dU+pn8LCdX/e+mJ/fC+EUaJT5nHEm0+IW4aKKYkYQI+rFMzN8ivj36MnMC5TGFi4H6zew==",
+			"resolved": "https://registry.npmjs.org/@tabler/icons-svelte-runes/-/icons-svelte-runes-3.44.0.tgz",
+			"integrity": "sha512-kncwVrQByKnhquybudKYQ1m9OT2Pjl2MEyGhAJmySPjm3uG5CjmcE66jag7A9Hz/D+fuRXYNcHtq99ontyi4aA==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@tabler/icons": "3.44.0"
@@ -1322,7 +1330,7 @@
 				"url": "https://github.com/sponsors/codecalm"
 			},
 			"peerDependencies": {
-				"svelte": ">=3 <6 || >=5.0.0-next.0"
+				"svelte": "^5.0.0"
 			}
 		},
 		"node_modules/@testing-library/svelte-core": {
@@ -1367,6 +1375,7 @@
 			"version": "1.0.9",
 			"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
 			"integrity": "sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==",
+			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/@types/json-schema": {
@@ -1390,6 +1399,7 @@
 			"version": "2.0.7",
 			"resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
 			"integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
+			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/@typescript-eslint/eslint-plugin": {
@@ -1542,7 +1552,7 @@
 			"version": "8.59.2",
 			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.2.tgz",
 			"integrity": "sha512-e82GVOE8Ps3E++Egvb6Y3Dw0S10u8NkQ9KXmtRhCWJJ8kDhOJTvtMAWnFL16kB1583goCWXsr0NieKCZMs2/0Q==",
-			"devOptional": true,
+			"dev": true,
 			"license": "MIT",
 			"engines": {
 				"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -1838,6 +1848,7 @@
 			"version": "8.16.0",
 			"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz",
 			"integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
+			"dev": true,
 			"license": "MIT",
 			"bin": {
 				"acorn": "bin/acorn"
@@ -1900,6 +1911,7 @@
 			"version": "5.3.1",
 			"resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.1.tgz",
 			"integrity": "sha512-Z/ZeOgVl7bcSYZ/u/rh0fOpvEpq//LZmdbkXyc7syVzjPAhfOa9ebsdTSjEBDU4vs5nC98Kfduj1uFo0qyET3g==",
+			"dev": true,
 			"license": "Apache-2.0",
 			"engines": {
 				"node": ">= 0.4"
@@ -1919,6 +1931,7 @@
 			"version": "4.1.0",
 			"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
 			"integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
+			"dev": true,
 			"license": "Apache-2.0",
 			"engines": {
 				"node": ">= 0.4"
@@ -1999,6 +2012,7 @@
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
 			"integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
+			"dev": true,
 			"license": "MIT",
 			"engines": {
 				"node": ">=6"
@@ -2112,9 +2126,10 @@
 			}
 		},
 		"node_modules/devalue": {
-			"version": "5.8.0",
-			"resolved": "https://registry.npmjs.org/devalue/-/devalue-5.8.0.tgz",
-			"integrity": "sha512-2zA9pFEsnp7vWBZbXF5JAgAq0fsUIt/1XPbRiAmRV3lp/2C3upzH+sADiyy66aFCihoLEsrQHxNM5w1gIDfsBg==",
+			"version": "5.8.1",
+			"resolved": "https://registry.npmjs.org/devalue/-/devalue-5.8.1.tgz",
+			"integrity": "sha512-4CXDYRBGqN+57wVJkuXBYmpAVUSg3L6JAQa/DFqm238G73E1wuyc/JhGQJzN7vUf/CMphYau2zXbfWzDR5aTEw==",
+			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/es-module-lexer": {
@@ -2349,6 +2364,7 @@
 			"version": "1.2.2",
 			"resolved": "https://registry.npmjs.org/esm-env/-/esm-env-1.2.2.tgz",
 			"integrity": "sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==",
+			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/espree": {
@@ -2386,6 +2402,7 @@
 			"version": "2.2.6",
 			"resolved": "https://registry.npmjs.org/esrap/-/esrap-2.2.6.tgz",
 			"integrity": "sha512-WN0clHt0a4mzC780UBVVBpsj4vSSjOFNRd2WjYtduB9HeKxm1sjHMNUwLEHVjI3FdCQD/Hurgz9ftbKEzP79Ow==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@jridgewell/sourcemap-codec": "^1.4.15"
@@ -2666,6 +2683,7 @@
 			"version": "3.0.3",
 			"resolved": "https://registry.npmjs.org/is-reference/-/is-reference-3.0.3.tgz",
 			"integrity": "sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@types/estree": "^1.0.6"
@@ -2773,6 +2791,7 @@
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
 			"integrity": "sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==",
+			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/locate-path": {
@@ -2802,6 +2821,7 @@
 			"version": "0.30.21",
 			"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
 			"integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@jridgewell/sourcemap-codec": "^1.5.5"
@@ -5188,9 +5208,10 @@
 			}
 		},
 		"node_modules/svelte": {
-			"version": "5.55.5",
-			"resolved": "https://registry.npmjs.org/svelte/-/svelte-5.55.5.tgz",
-			"integrity": "sha512-2uCs/LZ9us+AktdzYJM8OcxQ8qnPS1kpaO7syGT/MgO+6Qr1Ybl+TqPq+97u7PHqmmMlye5ZkoyXONy5mjjAbw==",
+			"version": "5.55.7",
+			"resolved": "https://registry.npmjs.org/svelte/-/svelte-5.55.7.tgz",
+			"integrity": "sha512-ymI5ykLPwIHW839E053FQbI1G+jnRFJEw3Kv5Y4njixVWywQBx+NUFpkkKyk5LIb36Fg9DVXSYpqiGekLD0hyw==",
+			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@jridgewell/remapping": "^2.3.4",
@@ -5202,7 +5223,7 @@
 				"aria-query": "5.3.1",
 				"axobject-query": "^4.1.0",
 				"clsx": "^2.1.1",
-				"devalue": "^5.6.4",
+				"devalue": "^5.8.1",
 				"esm-env": "^1.2.1",
 				"esrap": "^2.2.4",
 				"is-reference": "^3.0.3",
@@ -5728,6 +5749,7 @@
 			"version": "1.1.4",
 			"resolved": "https://registry.npmjs.org/zimmerframe/-/zimmerframe-1.1.4.tgz",
 			"integrity": "sha512-B58NGBEoc8Y9MWWCQGl/gq9xBCe4IiKM0a2x7GZdQKOW5Exr8S1W24J6OgM1njK8xCRGvAJIL/MxXHf6SkmQKQ==",
+			"dev": true,
 			"license": "MIT"
 		}
 	}
diff --git a/package.json b/package.json
index ebeadea..fc8ffc0 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
 		"@sveltejs/adapter-static": "^3.0.10",
 		"@sveltejs/kit": "^2.50.2",
 		"@sveltejs/vite-plugin-svelte": "^6.2.4",
+		"@tabler/icons-svelte-runes": "^3.44.0",
 		"@types/node": "^22",
 		"@vitest/browser-playwright": "^4.0.18",
 		"eslint": "^9.39.2",
@@ -41,8 +42,7 @@
 		"vitest-browser-svelte": "^2.0.2"
 	},
 	"dependencies": {
-		"@owlboard/api-schema-types": "^3.0.3-alpha18",
-		"@owlboard/owlboard-ts": "^3.0.0-dev.20260509t2101",
-		"@tabler/icons-svelte": "^3.40.0"
+		"@owlboard/api-schema-types": "^3.0.3-alpha19",
+		"@owlboard/owlboard-ts": "^3.0.0-dev.20260509t2101"
 	}
 }
diff --git a/src/lib/components/ui/NoResults.svelte b/src/lib/components/ui/NoResults.svelte
index 65c2b64..5194187 100644
--- a/src/lib/components/ui/NoResults.svelte
+++ b/src/lib/components/ui/NoResults.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import noResult from '$lib/assets/img/no-data.svg';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Button from '$lib/components/ui/form-elements/Button.svelte';
 	let { title = 'No results', message = 'Try checking your search term' } = $props();
 </script>
 
diff --git a/src/lib/components/ui/TrainService.svelte b/src/lib/components/ui/TrainService.svelte
index 104d3c5..30591fd 100644
--- a/src/lib/components/ui/TrainService.svelte
+++ b/src/lib/components/ui/TrainService.svelte
@@ -6,7 +6,7 @@
 	import { formatUkTime, calculateDelay } from '$lib/utils/time';
 	import TocStyle from '$lib/components/ui/TocStyle.svelte';
 	import TiplocConverter from '$lib/components/ui/TiplocConverter.svelte';
-	import { IconChevronDownFilled } from '@tabler/icons-svelte';
+	import { IconChevronDownFilled } from '@tabler/icons-svelte-runes';
 	import { estClass } from '$lib/utils/time';
 	let { service }: { service: ApiTrainsTrainByHeadcode.TrainByHeadcodeResponse } = $props();
 	let isExpanded = $state(false);
diff --git a/src/lib/components/ui/cards/BaseCard.svelte b/src/lib/components/ui/cards/BaseCard.svelte
index af89e00..6824fa5 100644
--- a/src/lib/components/ui/cards/BaseCard.svelte
+++ b/src/lib/components/ui/cards/BaseCard.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import type { Snippet } from 'svelte';
-	import { IconHelpCircle } from '@tabler/icons-svelte';
+	import { IconHelpCircle } from '@tabler/icons-svelte-runes';
 	import { slide } from 'svelte/transition';
 
 	interface Props {
diff --git a/src/lib/components/ui/cards/HeadcodeSearchCard.svelte b/src/lib/components/ui/cards/HeadcodeSearchCard.svelte
index 975923c..bc0bb81 100644
--- a/src/lib/components/ui/cards/HeadcodeSearchCard.svelte
+++ b/src/lib/components/ui/cards/HeadcodeSearchCard.svelte
@@ -1,8 +1,7 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
 	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-	import Textbox from '$lib/components/ui/Textbox.svelte';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Textbox from '$lib/components/ui/form-elements/Textbox.svelte';
 
 	let headcode = $state('');
 
diff --git a/src/lib/components/ui/cards/LocationBoardCard.svelte b/src/lib/components/ui/cards/LocationBoardCard.svelte
index 9ef7e01..27c79e7 100644
--- a/src/lib/components/ui/cards/LocationBoardCard.svelte
+++ b/src/lib/components/ui/cards/LocationBoardCard.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-	import LocationSearchBox from '$lib/components/ui/LocationSearchBox.svelte';
+	import LocationSearchBox from '$lib/components/ui/form-elements/LocationSearchBox.svelte';
 
 	let locationValue = $state('');
 
diff --git a/src/lib/components/ui/cards/NearbyStationsCard.svelte b/src/lib/components/ui/cards/NearbyStationsCard.svelte
index 40796e6..ba391c5 100644
--- a/src/lib/components/ui/cards/NearbyStationsCard.svelte
+++ b/src/lib/components/ui/cards/NearbyStationsCard.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Button from '$lib/components/ui/form-elements/Button.svelte';
 
 	import { fade } from 'svelte/transition';
 	import { flip } from 'svelte/animate';
diff --git a/src/lib/components/ui/cards/QuickLinksCard.svelte b/src/lib/components/ui/cards/QuickLinksCard.svelte
index 49165c5..a0475ca 100644
--- a/src/lib/components/ui/cards/QuickLinksCard.svelte
+++ b/src/lib/components/ui/cards/QuickLinksCard.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Button from '$lib/components/ui/form-elements/Button.svelte';
 
 	import { fade } from 'svelte/transition';
 	import { flip } from 'svelte/animate';
diff --git a/src/lib/components/ui/cards/pis/PisCode.svelte b/src/lib/components/ui/cards/pis/PisCode.svelte
index 4720647..2f6c270 100644
--- a/src/lib/components/ui/cards/pis/PisCode.svelte
+++ b/src/lib/components/ui/cards/pis/PisCode.svelte
@@ -1,7 +1,6 @@
 <script lang="ts">
 	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-	import Textbox from '$lib/components/ui/Textbox.svelte';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Textbox from '$lib/components/ui/form-elements/Textbox.svelte';
 
 	let { onsearch }: { onsearch: (c: string) => void } = $props();
 </script>
diff --git a/src/lib/components/ui/cards/pis/PisStartEndCard.svelte b/src/lib/components/ui/cards/pis/PisStartEndCard.svelte
index 0199bde..141fddd 100644
--- a/src/lib/components/ui/cards/pis/PisStartEndCard.svelte
+++ b/src/lib/components/ui/cards/pis/PisStartEndCard.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-	import Textbox from '$lib/components/ui/Textbox.svelte';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Textbox from '$lib/components/ui/form-elements/Textbox.svelte';
+	import Button from '$lib/components/ui/form-elements/Button.svelte';
 
 	let { onsearch }: { onsearch: (s: string, e: string) => void } = $props();
 
@@ -15,7 +15,13 @@
 </script>
 
 <BaseCard header={'Find by Start/End CRS'}>
-	<div class="card-content">
+	<form
+		class="card-content"
+		onsubmit={(e) => {
+			e.preventDefault();
+			onsearch(startValue, endValue);
+		}}
+	>
 		<div class="textbox-container">
 			<div class="textbox-item-wrapper">
 				<Textbox placeholder={'Start'} uppercase={true} maxLength={3} bind:value={startValue} />
@@ -25,10 +31,10 @@
 			</div>
 		</div>
 		<div class="button-wrapper">
-			<Button onclick={() => onsearch(startValue, endValue)}>Search</Button>
+			<Button type={'submit'}>Search</Button>
 			<Button onclick={resetValues}>Reset</Button>
 		</div>
-	</div>
+	</form>
 </BaseCard>
 
 <style>
diff --git a/src/lib/components/ui/Button.svelte b/src/lib/components/ui/form-elements/Button.svelte
similarity index 100%
rename from src/lib/components/ui/Button.svelte
rename to src/lib/components/ui/form-elements/Button.svelte
diff --git a/src/lib/components/ui/LocationSearchBox.svelte b/src/lib/components/ui/form-elements/LocationSearchBox.svelte
similarity index 98%
rename from src/lib/components/ui/LocationSearchBox.svelte
rename to src/lib/components/ui/form-elements/LocationSearchBox.svelte
index 83510af..7a758e7 100644
--- a/src/lib/components/ui/LocationSearchBox.svelte
+++ b/src/lib/components/ui/form-elements/LocationSearchBox.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import Textbox from '$lib/components/ui/Textbox.svelte';
+	import Textbox from '$lib/components/ui/form-elements/Textbox.svelte';
 	import { onMount } from 'svelte';
 	import { fade } from 'svelte/transition';
 	import { goto } from '$app/navigation';
diff --git a/src/lib/components/ui/Textbox.svelte b/src/lib/components/ui/form-elements/Textbox.svelte
similarity index 97%
rename from src/lib/components/ui/Textbox.svelte
rename to src/lib/components/ui/form-elements/Textbox.svelte
index ea8f156..efdf0e6 100644
--- a/src/lib/components/ui/Textbox.svelte
+++ b/src/lib/components/ui/form-elements/Textbox.svelte
@@ -2,7 +2,7 @@
 	import { fade } from 'svelte/transition';
 	import type { HTMLInputAttributes } from 'svelte/elements';
 
-	import { IconChevronRightFilled } from '@tabler/icons-svelte';
+	import { IconChevronRightFilled } from '@tabler/icons-svelte-runes';
 
 	interface Props extends HTMLInputAttributes {
 		value?: string;
diff --git a/src/lib/components/ui/station-board/StationAlertCard.svelte b/src/lib/components/ui/station-board/StationAlertCard.svelte
index 837891c..4d9e964 100644
--- a/src/lib/components/ui/station-board/StationAlertCard.svelte
+++ b/src/lib/components/ui/station-board/StationAlertCard.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { slide } from 'svelte/transition';
 	import type { ApiStationsBoard } from '@owlboard/owlboard-ts';
-	import { IconAlertOctagonFilled, IconChevronDownFilled } from '@tabler/icons-svelte';
+	import { IconAlertOctagonFilled, IconChevronDownFilled } from '@tabler/icons-svelte-runes';
 
 	let { messages = [] }: { messages: ApiStationsBoard.BoardMsgs[] } = $props();
 	let isOpen = $state(false);
diff --git a/src/lib/global.css b/src/lib/global.css
index cd0851e..c1c36f4 100644
--- a/src/lib/global.css
+++ b/src/lib/global.css
@@ -130,22 +130,6 @@
 	font-display: swap;
 }
 
-/* Fira Code - Variable with fallback */
-@font-face {
-	font-family: 'Fira Code';
-	src: url('/type/fira-code/FiraCode-VF.woff2') format('woff2-variations');
-	font-weight: 300 700;
-	font-style: normal;
-	font-display: swap;
-}
-@font-face {
-	font-family: 'Fira Code';
-	src: url('/type/fira-code/FiraCode-Regular.woff2') format('woff2');
-	font-weight: 400;
-	font-style: normal;
-	font-display: swap;
-}
-
 /* Inconsolata Variable */
 @font-face {
 	font-family: 'Inconsolata Variable';
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 8984186..b56d7ae 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -3,17 +3,22 @@
 
 	import stopErr from '$lib/assets/img/stop-error.svg';
 	import noResult from '$lib/assets/img/no-data.svg';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Button from '$lib/components/ui/form-elements/Button.svelte';
 </script>
 
+<!-- Will need to check error type, using the upstream code combined with response code -->
+
 <div class="error-wrapper">
 	{#if page.status == 404}
 		<!-- Warning no data image -->
 		<img class="err-img" src={noResult} alt="" role="presentation" width="200" height="200" />
-	{:else if page.status == 499}
+	{:else if page.status == 503}
 		<!-- Change to a GSM-R X Sign?? -->
 		<span>OFFLINE!</span>
 		<img class="err-img" src={stopErr} alt="" role="presentation" width="150" height="210" />
+	{:else if page.status == 403}
+		<span>UNAUTH</span>
+		<img class="err-img" src={stopErr} alt="" role="presentation" width="150" height="210" />
 	{:else}
 		<!-- STOP Error image -->
 		<img class="err-img" src={stopErr} alt="" role="presentation" width="150" height="210" />
@@ -24,9 +29,12 @@
 		{page.error?.message ?? 'An unexpected derailment occurred.'}
 	</p>
 
-	{#if page.error?.owlCode}
+	{#if page.error?.owlCode == 'NETWORK_DISCONNECTED'}
+		<p>THISISANETWORKERR</p>
+		<p>Operational data is unavaliable when offline</p>
+	{:else}
 		<div class="debug-info">
-			<code>Ref: {page.error.owlCode}</code>
+			<code>Ref: {page.error?.owlCode}</code>
 		</div>
 	{/if}
 
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 0b7970b..110a701 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -15,7 +15,7 @@
 	import logoPlain from '$lib/assets/round-logo.svg';
 	import favicon from '$lib/assets/round-logo.svg';
 
-	import { IconHome, IconDialpad, IconSettings, IconHelp, IconDots } from '@tabler/icons-svelte';
+	import { IconHome, IconDialpad, IconSettings, IconHelp, IconDots } from '@tabler/icons-svelte-runes';
 
 	onMount(async () => {
 		LOCATIONS.init();
diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte
index 4e6b938..7215400 100644
--- a/src/routes/about/+page.svelte
+++ b/src/routes/about/+page.svelte
@@ -11,13 +11,19 @@
 </script>
 
 <div class="logo-container">
-	<img
-		class="logo"
-		src={logo}
-		alt="OwlBoard Logo"
-		onclick={handleLogoTap}
-		class:animate={isSpinning}
-	/>
+    <button
+        type="button"
+        class="logo-btn"
+        onclick={handleLogoTap}
+        class:animate={isSpinning}
+        aria-label="Spin the OwlBoard logo"
+    >
+        <img
+            class="logo-img"
+            src={logo}
+            alt="OwlBoard Logo"
+        />
+    </button>
 </div>
 
 <section class="about">
@@ -59,6 +65,19 @@
 		text-align: center;
 	}
 
+	.logo-btn {
+        background: none;
+        border: none;
+        padding: 0;
+        cursor: pointer;
+        display: inline-block;
+        padding-top: 25px;
+        margin: auto;
+        width: clamp(80px, 20vw, 200px);
+    }
+
+
+
 	@keyframes owl-spin {
 		0% {
 			transform: rotate(0deg);
@@ -71,16 +90,15 @@
 		}
 	}
 
-	.logo {
-		padding-top: 25px;
-		margin: auto;
-		height: auto;
-		width: clamp(80px, 20vw, 200px);
-	}
+	.logo-img {
+        width: 100%;
+        height: auto;
+        display: block;
+    }
 
-	.logo.animate {
-		animation: owl-spin 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
-	}
+	.logo-btn.animate {
+        animation: owl-spin 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
+    }
 
 	section {
 		margin: auto;
diff --git a/src/routes/board/+page.ts b/src/routes/board/+page.ts
index 8dda86a..2da8c3d 100644
--- a/src/routes/board/+page.ts
+++ b/src/routes/board/+page.ts
@@ -35,30 +35,12 @@ export const load: PageLoad = async ({ url, fetch }) => {
 			boardData
 		};
 	} catch (e: unknown) {
-		if (
-			e instanceof TypeError &&
-			(e.message == 'Failed to fetch' || e.message.includes('network'))
-		) {
-			throw error(503, {
-				message: 'Network error: Please check your connection',
+		if (e instanceof TypeError && e.message === 'Failed to fetch') {
+			error(503, {
+				message: 'Cannot connect to the OwlBoard server',
 				owlCode: 'NETWORK_DISCONNECTED'
 			});
 		}
-		if (e instanceof ValidationError) {
-			throw error(400, { message: e.message, owlCode: 'VALIDATION_ERROR' });
-		} else if (e instanceof ApiError) {
-			// If the API returns 404, it means the backend doesn't recognize this CRS/TIPLOC
-			if (e.code === 'NOT_FOUND') {
-				throw error(404, {
-					message: `Location (${locId.toUpperCase()}) is not recognized by the server.`,
-					owlCode: 'LOCATION_NOT_IN_BACKEND'
-				});
-			}
-			throw error(e.status, { message: e.message, owlCode: 'API_ERROR' });
-		} else if (e instanceof Error) {
-			throw error(500, { message: e.message, owlCode: 'GEN_ERROR' });
-		}
-
-		throw error(500, { message: 'Unexpected error', owlCode: 'UNKNOWN_ERR' });
+		throw e;
 	}
 };
diff --git a/src/routes/pis/+page.svelte b/src/routes/pis/+page.svelte
index de1d3c3..9aeaccc 100644
--- a/src/routes/pis/+page.svelte
+++ b/src/routes/pis/+page.svelte
@@ -2,7 +2,7 @@
 	import HeadcodeSearchCard from '$lib/components/ui/cards/HeadcodeSearchCard.svelte';
 	import PisStartEndCard from '$lib/components/ui/cards/pis/PisStartEndCard.svelte';
 	import PisCode from '$lib/components/ui/cards/pis/PisCode.svelte';
-	import Button from '$lib/components/ui/Button.svelte';
+	import Button from '$lib/components/ui/form-elements/Button.svelte';
 	import type { ApiPisObject } from '@owlboard/owlboard-ts';
 	import { OwlClient, ApiError, ValidationError } from '$lib/owlClient';
 	import TocStyle from '$lib/components/ui/TocStyle.svelte';
@@ -18,14 +18,14 @@
 		try {
 			const response = await OwlClient.pis.getByStartEndCrs(start, end);
 			results = response.data || [];
-		} catch (e) {
+		} catch (e: unknown) {
 			if (e instanceof ValidationError) {
 				errorState = { status: 400, message: e.message };
 			} else if (e instanceof ApiError) {
 				console.log(e);
 				errorState = { status: 20, message: e.message };
 			} else {
-				errorState = { status: 0, message: `Unknown Error: ${e.message}` };
+				errorState = { status: 0, message: `Unknown Error: ${e instanceof Error ? e.message : String(e)}` };
 			}
 		} finally {
 			resultsLoaded = true;
@@ -45,7 +45,7 @@
 				console.log(e);
 				errorState = { status: 20, message: e.message };
 			} else {
-				errorState = { status: 0, message: `Unknown Error: ${e.message}` };
+				errorState = { status: 0, message: `Unknown Error: ${e instanceof Error ? e.message : String(e)}` };
 			}
 		} finally {
 			resultsLoaded = true;
diff --git a/src/routes/trains/+page.ts b/src/routes/trains/+page.ts
index af996a9..d0dbbf1 100644
--- a/src/routes/trains/+page.ts
+++ b/src/routes/trains/+page.ts
@@ -29,34 +29,12 @@ export const load: PageLoad = async ({ fetch, url }) => {
 			results: results
 		};
 	} catch (e: unknown) {
-		if (e instanceof ValidationError) {
-			throw error(400, {
-				message: e.message,
-				owlCode: 'VALIDATION_ERROR'
-			});
-		} else if (e instanceof ApiError) {
-			// Check if NO_RESULTS error, and return empty array if that is the case
-			if (e.code === 'NOT_FOUND') {
-				return {
-					title: headcode.toUpperCase(),
-					results: []
-				};
-			} else {
-				throw error(e.status, {
-					message: e.message,
-					owlCode: 'API_ERROR'
-				});
-			}
-		} else if (e instanceof Error) {
-			throw error(500, {
-				message: e.message,
-				owlCode: 'GEN_ERROR'
-			});
-		} else {
-			throw error(500, {
-				message: 'Unexpected error',
-				owlCode: 'UNKNOWN_ERR'
+		if (e instanceof TypeError && e.message === 'Failed to fetch') {
+			error(503, {
+				message: 'Cannot connect to the OwlBoard server',
+				owlCode: 'NETWORK_DISCONNECTED'
 			});
 		}
+		throw e;
 	}
 };
diff --git a/src/service-worker.ts b/src/service-worker.ts
index ea87721..cc409c0 100644
--- a/src/service-worker.ts
+++ b/src/service-worker.ts
@@ -42,13 +42,53 @@ sw.addEventListener('fetch', (event) => {
 		return;
 	}
 
-	// 1. Static Assets (Cache-First)
+	// Static Assets (Cache-First)
 	if (ASSETS.includes(url.pathname) || url.pathname.startsWith('/_app/')) {
 		event.respondWith(caches.match(request).then((res) => res || fetch(request)));
 		return;
 	}
 
-	// 2. Offline API Fallback (Network-First)
+	// Cachable API Responses - stale-while-revalidate
+	if (url.pathname === '/api/v3/locationFilter/data') {
+		event.respondWith(
+			caches.open('ob-dynamic-cache').then(async (cache) => {
+				const cachedResponse = await cache.match(request);
+
+				// Ensure fallback response exists
+				const makeOfflineFallback = () => {
+					const errorObject: ApiEnvelope.Envelope = {
+						e: {
+							code: 'NETWORK_DISCONNECTED',
+							msg: 'Cannot connect to the OwlBoard server'
+						},
+						t: Math.floor(Date.now() / 1000)
+					};
+					return new Response(JSON.stringify(errorObject), {
+						status: 503,
+						headers: { 'Content-Type': 'application/json' }
+					});
+				};
+
+				const networkFetch = fetch(request)
+					.then((networkResponse) => {
+						if (networkResponse.ok) {
+							cache.put(request, networkResponse.clone());
+						}
+						return networkResponse;
+					})
+					.catch(() => {
+						// If offline & cache empty, return fallback
+						return makeOfflineFallback();
+					});
+
+				// If cachedResponse is undefined, networkFetch safely resolves to a Response
+				return cachedResponse || networkFetch;
+			})
+		);
+		return;
+	}
+
+	// Offline API Fallback (Network-First)
 	if (url.pathname.startsWith('/api') || url.hostname.includes('api')) {
 		event.respondWith(
 			fetch(request).catch(() => {
@@ -68,13 +108,11 @@ sw.addEventListener('fetch', (event) => {
 		return;
 	}
 
-	// 3. Navigation Fallback (The Offline 404 Catch-All)
-	// This catches top-level page navigations and hard refreshes
+	// Nav fallback - return fallback page, if offline and page requested
 	if (request.mode === 'navigate' || request.headers.get('accept')?.includes('text/html')) {
 		event.respondWith(
 			fetch(request).catch(() => {
-				// The network request failed entirely (offline).
-				// Serve the cached root shell so SvelteKit can boot.
+				// Serve svelte fallback page
 				return caches.match('/') as Promise<Response>;
 			})
 		);