feat(frontend): integrate error handling into application

App.svelte:
- Import and render ErrorModal component
- Add ErrorModal to main app layout below Header

CheckIfAniListLoggedInAndLoadWatchList.svelte:
- Import error state helpers (setApiError, clearApiError)
- Wrap LoadAniListUser in try-catch with error handling
- Wrap LoadAniListWatchList in try-catch with error handling
- Update CheckIfAniListLoggedInAndLoadWatchList with error handling
- Remove old alert() calls in favor of modal system

Home.svelte:
- Import isApiDown and apiError stores
- Add conditional rendering for API down state
- Display user-friendly "API Unavailable" message when apiError is set
- Show warning icon and helpful messaging

Error handling is now fully integrated across the frontend application.

frontend/src/routes/Home.svelte

@@ -1,25 +1,55 @@
 <script lang="ts">
-import Pagination from "../helperComponents/Pagination.svelte";
-import WatchList from "../helperComponents/WatchList.svelte";
-import {
+  import Pagination from "../helperComponents/Pagination.svelte";
+  import WatchList from "../helperComponents/WatchList.svelte";
+  import {
     aniListLoggedIn,
     aniListPrimary,
     loading,
-} from "../helperModules/GlobalVariablesAndHelperFunctions.svelte";
-import loader from '../helperFunctions/loader'
+    isApiDown,
+    apiError,
+  } from "../helperModules/GlobalVariablesAndHelperFunctions.svelte";
+  import loader from "../helperFunctions/loader";
 
-let isAniListPrimary: boolean
-let isAniListLoggedIn: boolean
+  let isAniListPrimary: boolean;
+  let isAniListLoggedIn: boolean;
 
-aniListPrimary.subscribe((value) => isAniListPrimary = value)
-aniListLoggedIn.subscribe((value) => isAniListLoggedIn = value)
+  aniListPrimary.subscribe((value) => (isAniListPrimary = value));
+  aniListLoggedIn.subscribe((value) => (isAniListLoggedIn = value));
 </script>
-{#if isAniListLoggedIn && isAniListPrimary}
-<div class="container py-10">
+
+{#if $isApiDown}
+  <div class="container py-10">
+    <div
+      class="bg-yellow-50 border border-yellow-200 rounded-lg p-6 text-center"
+    >
+      <svg
+        class="mx-auto h-12 w-12 text-yellow-600 mb-4"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke="currentColor"
+      >
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
+        />
+      </svg>
+      <h2 class="text-xl font-semibold text-yellow-900 mb-2">
+        API Unavailable
+      </h2>
+      <p class="text-yellow-700 mb-4">
+        The {$apiError?.service || "service"} is currently unavailable. The app will
+        remain open, and you can retry when the service is back online.
+      </p>
+    </div>
+  </div>
+{:else if isAniListLoggedIn && isAniListPrimary}
+  <div class="container py-10">
     <Pagination />
     <WatchList />
     <Pagination />
-</div>
+  </div>
 {:else}
-    <div use:loader={loading}></div>
-{/if}
+  <div use:loader={loading}></div>
+{/if}