Implemented offline-first fast-paths and hardened API/Layout resilience. Added reactive offline banner, root error page, and ghost site fallbacks to handle server downtime and connection loss without crashing.

src/routes/+error.svelte

@@ -0,0 +1,63 @@
+<script lang="ts">
+	import { page } from '$app/state';
+    import { RefreshCw, Home, AlertTriangle } from '@lucide/svelte';
+    import { browser } from '$app/environment';
+
+    let status = $derived(page.status);
+    let message = $derived(page.error?.message || 'An unexpected error occurred');
+    
+    // Check if it looks like a connection/API failure
+    let is_connection_error = $derived(
+        message.toLowerCase().includes('site lookup failed') || 
+        message.toLowerCase().includes('fetch') ||
+        status === 500
+    );
+</script>
+
+<div class="flex flex-col items-center justify-center min-h-screen p-4 bg-surface-50 dark:bg-surface-900 text-center">
+    <div class="max-w-md p-8 rounded-2xl shadow-xl bg-white dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
+        
+        <div class="mb-6 flex justify-center">
+            <div class="p-4 rounded-full bg-error-100 dark:bg-error-900 text-error-600 dark:text-error-400">
+                <AlertTriangle size={48} />
+            </div>
+        </div>
+
+        <h1 class="text-6xl font-black mb-2 text-surface-900 dark:text-white">{status}</h1>
+        <h2 class="text-2xl font-bold mb-4 text-surface-700 dark:text-surface-200">
+            {#if is_connection_error}
+                Connection Failure
+            {:else}
+                Something went wrong
+            {/if}
+        </h2>
+        
+        <p class="text-surface-600 dark:text-surface-400 mb-8 leading-relaxed">
+            {message}
+        </p>
+
+        <div class="flex flex-col gap-3">
+            <button 
+                onclick={() => browser && window.location.reload()}
+                class="btn btn-lg preset-filled-primary-500 hover:preset-filled-primary-600 w-full font-bold"
+            >
+                <RefreshCw class="mr-2 size-5" />
+                Retry Connection
+            </button>
+
+            <a 
+                href="/" 
+                class="btn btn-lg preset-outlined-surface-500 w-full font-bold"
+            >
+                <Home class="mr-2 size-5" />
+                Return Home
+            </a>
+        </div>
+
+        {#if is_connection_error}
+            <div class="mt-8 pt-6 border-t border-surface-100 dark:border-surface-700 text-sm text-surface-500">
+                <p>If you are onsite at an event, please check your network connection or contact the registration desk.</p>
+            </div>
+        {/if}
+    </div>
+</div>