chore(release): 1.11.3

fix(cards): Z-Index for bulk card modal
chore(deps): Updated lock
2025-04-25 14:53:55 +02:00 · 2025-04-25 14:53:36 +02:00 · 2025-04-25 14:51:47 +02:00 · 2025-04-23 11:01:55 +02:00 · 2025-04-23 11:01:06 +02:00 · 2025-04-22 22:28:19 +02:00
73 changed files with 2273 additions and 6516 deletions
--- a/.gitea/workflows/release.yaml
+++ b/.gitea/workflows/release.yaml
@@ -14,7 +14,7 @@ jobs:
        uses: actions/setup-node@v4
        with:
          node-version: 19
-      - run: npm i -g pnpm@10.7 && pnpm i
+      - run: npm i -g pnpm@10.8 && pnpm i
      - run: pnpm licenses:export
      - name: Login to registry
        uses: docker/login-action@v3
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,9 +2,103 @@

 All notable changes to this project will be documented in this file. Dates are displayed in UTC.

+#### [1.11.3](https://git.odit.services/lfk/frontend/compare/1.11.2...1.11.3)
+
+- chore(deps): Updated lock [`bce6d48`](https://git.odit.services/lfk/frontend/commit/bce6d484a9b1d7c40d4575a64ad528da2cc8fb3c)
+- fix(cards): Z-Index for bulk card modal [`efad6fd`](https://git.odit.services/lfk/frontend/commit/efad6fdf2eae12c904575727b61fc61ed8a27d14)
+
+#### [1.11.2](https://git.odit.services/lfk/frontend/compare/1.11.1...1.11.2)
+
+> 23 April 2025
+
+- chore(release): 1.11.2 [`2dea19d`](https://git.odit.services/lfk/frontend/commit/2dea19df8990b34a56a345fef05487684ecec8c4)
+- fix(cardassignment): handle card not found [`6c98646`](https://git.odit.services/lfk/frontend/commit/6c986467d39344a32e598b834a115932ab8c9a1f)
+
+#### [1.11.1](https://git.odit.services/lfk/frontend/compare/1.11.0...1.11.1)
+
+> 22 April 2025
+
+- chore(release): 1.11.1 [`3cedbeb`](https://git.odit.services/lfk/frontend/commit/3cedbebe40b7699e39edc133e4bcbc16f4e7eb56)
+- ci: fix build [`dc986e4`](https://git.odit.services/lfk/frontend/commit/dc986e4fe5d462909e34b8bbf9a3c10accb2a00b)
+
+#### [1.11.0](https://git.odit.services/lfk/frontend/compare/1.10.6...1.11.0)
+
+> 22 April 2025
+
+- chore: move to tailwind v4 [`81a8ce0`](https://git.odit.services/lfk/frontend/commit/81a8ce002cd5a470f5ac4f064360c09bcf815ac8)
+- chore(deps): bump [`244be47`](https://git.odit.services/lfk/frontend/commit/244be471f07a6ab77768fb599cc2381a319e4e22)
+- chore: move privacy & imprint to website links [`3288ffb`](https://git.odit.services/lfk/frontend/commit/3288ffb3cc52bcfbb2b94c373932e9d614fba80f)
+- fix: modal position & z index [`a12c4f8`](https://git.odit.services/lfk/frontend/commit/a12c4f87d2db2271a6b123c3a009bd8d2f7663a4)
+- chore: tailwind class cleanup [`80ab4e0`](https://git.odit.services/lfk/frontend/commit/80ab4e037e44edf1f076d4a365ef36c614e7cb0a)
+- fix(cardassignment): debounce w/ immediate start [`1d6ed99`](https://git.odit.services/lfk/frontend/commit/1d6ed990736c6156b67f0715ee1f86aeb2be0390)
+- fix(RunnerDetail): move to standard html select for groups [`e1bf435`](https://git.odit.services/lfk/frontend/commit/e1bf435080a3845a4a29f9b8bce7aba3e9220cf9)
+- chore(release): 1.11.0 [`cae6be6`](https://git.odit.services/lfk/frontend/commit/cae6be6f867aece8997799e90f783a7b5f9b7602)
+- feat(ImportRunnerModal): sort groups by name [`3124574`](https://git.odit.services/lfk/frontend/commit/312457494cb0da805df5ec2811604ea45a09963d)
+- feat(cards): badge style for runner links [`1605b0f`](https://git.odit.services/lfk/frontend/commit/1605b0f7b2c12d2b247f40aefc03d2d053fea60d)
+
+#### [1.10.6](https://git.odit.services/lfk/frontend/compare/1.10.5...1.10.6)
+
+> 22 April 2025
+
+- feat: improved mobile card assignment [`d841727`](https://git.odit.services/lfk/frontend/commit/d841727439e42c940d56001f08da4ae2399176a7)
+- chore(release): 1.10.6 [`3fab344`](https://git.odit.services/lfk/frontend/commit/3fab3447799a5a28db741643189a2c4217b03714)
+
+#### [1.10.5](https://git.odit.services/lfk/frontend/compare/1.10.4...1.10.5)
+
+> 22 April 2025
+
+- chore(release): 1.10.5 [`87df34b`](https://git.odit.services/lfk/frontend/commit/87df34bb56c04c1efd22ecbe0b857198358f93d5)
+- feat(runners): add distance sorting [`9c3b742`](https://git.odit.services/lfk/frontend/commit/9c3b742a98e17837fbcabe308fb2774dc13b03b8)
+
+#### [1.10.4](https://git.odit.services/lfk/frontend/compare/1.10.3...1.10.4)
+
+> 22 April 2025
+
+- chore(release): 1.10.4 [`68bf371`](https://git.odit.services/lfk/frontend/commit/68bf3717f9cf15a547c51e245452d4e013f7acad)
+- fix(runners): Fix runner overview sort [`f88c6e0`](https://git.odit.services/lfk/frontend/commit/f88c6e0dbab620887e180de0d3eab03b8215a477)
+
+#### [1.10.3](https://git.odit.services/lfk/frontend/compare/1.10.2...1.10.3)
+
+> 17 April 2025
+
+- feat(pdf): Send selfservicelink for generation [`01e77a9`](https://git.odit.services/lfk/frontend/commit/01e77a97f3f28700e0249d35afd9641b56d9c55d)
+- chore(release): 1.10.3 [`12050cd`](https://git.odit.services/lfk/frontend/commit/12050cdda95b5f8eb5b414b81655d06faae3ef1e)
+- chore(deps): Bump @odit/lfk-client-js [`10824b5`](https://git.odit.services/lfk/frontend/commit/10824b5d9b207e14a37fa23e90d54337d76e60a9)
+
+#### [1.10.2](https://git.odit.services/lfk/frontend/compare/1.10.1...1.10.2)
+
+> 11 April 2025
+
+- refactor(runners): filter table for created_via [`785b9e0`](https://git.odit.services/lfk/frontend/commit/785b9e0b60a9961f99d0c519d6bb12dc735ac605)
+- chore(release): 1.10.2 [`d9870e0`](https://git.odit.services/lfk/frontend/commit/d9870e03bc3175ee9b299174a19f257d6046a718)
+
+#### [1.10.1](https://git.odit.services/lfk/frontend/compare/1.10.0...1.10.1)
+
+> 9 April 2025
+
+- feat: runner list filtered by created_via [`991716a`](https://git.odit.services/lfk/frontend/commit/991716a7f55d0414111ad264ad1e93de9e82971a)
+- chore(release): 1.10.1 [`fce2bc6`](https://git.odit.services/lfk/frontend/commit/fce2bc645e040322f4d1b98a1ed1ab5df7227b6d)
+
+#### [1.10.0](https://git.odit.services/lfk/frontend/compare/1.9.11...1.10.0)
+
+> 9 April 2025
+
+- feat: working CardAssignment [`ac4ef8f`](https://git.odit.services/lfk/frontend/commit/ac4ef8fb6ded5c5d5678a651420e356b3ef45399)
+- chore(release): 1.10.0 [`aa720f2`](https://git.odit.services/lfk/frontend/commit/aa720f2460079e35eed9d87a2ac580a3305efbd5)
+
+#### [1.9.11](https://git.odit.services/lfk/frontend/compare/1.9.10...1.9.11)
+
+> 8 April 2025
+
+- feat(dash): add runnersViaKiosk [`5291f8a`](https://git.odit.services/lfk/frontend/commit/5291f8a4d1721cd0c745191ebc85f221c34a23c8)
+- chore(release): 1.9.11 [`eae0afd`](https://git.odit.services/lfk/frontend/commit/eae0afda23a54020e25821c0188d8cbec3139593)
+
 #### [1.9.10](https://git.odit.services/lfk/frontend/compare/1.9.9...1.9.10)

+> 8 April 2025
+
 - feat: add experimental ui for mobile card assignment [`d7c9c27`](https://git.odit.services/lfk/frontend/commit/d7c9c27ec7a1fea1cbaf26914843d044bbae32fe)
+- chore(release): 1.9.10 [`e2d7de1`](https://git.odit.services/lfk/frontend/commit/e2d7de1e9e1fd134f54876fa80f19f94fbea3672)

 #### [1.9.9](https://git.odit.services/lfk/frontend/compare/1.9.8...1.9.9)

--- a/4
+++ b/4
@@ -2,8 +2,8 @@ FROM registry.odit.services/hub/library/node:23.10.0-alpine3.21 AS build
 ARG NPM_REGISTRY_URL=https://registry.npmjs.org
 WORKDIR /app

-COPY package.json pnpm-lock.yaml vite.config.js tailwind.config.cjs postcss.config.cjs index.html ./
-RUN npm config set registry $NPM_REGISTRY_URL && npm i -g pnpm@10.7
+COPY package.json pnpm-lock.yaml vite.config.js index.html ./
+RUN npm config set registry $NPM_REGISTRY_URL && npm i -g pnpm@10.8
 RUN mkdir /pnpm && pnpm config set store-dir /pnpm && pnpm i

 COPY src ./src
--- a/index.html
+++ b/index.html
@@ -13,7 +13,7 @@

  <body>
    <span style="display: none; visibility: hidden" id="buildinfo"
-      >RELEASE_INFO-1.9.10-RELEASE_INFO</span
+      >RELEASE_INFO-1.11.3-RELEASE_INFO</span
    >
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <script src="/env.js"></script>
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@odit/lfk-frontend",
-  "version": "1.9.10",
+  "version": "1.11.3",
  "type": "module",
  "scripts": {
    "i18n-order": "node order.js",
@@ -14,15 +14,14 @@
  "devDependencies": {
    "@odit/license-exporter": "0.2.0",
    "@sveltejs/vite-plugin-svelte": "2.1.1",
+    "@types/papaparse": "^5.3.15",
+    "@types/underscore": "^1.13.0",
    "auto-changelog": "2.5.0",
-    "autoprefixer": "10.4.21",
-    "postcss": "8.5.3",
    "prettier": "3.5.3",
    "prettier-plugin-svelte": "3.3.3",
    "release-it": "17.10.0",
    "svelte-select": "3.17.0",
-    "tailwindcss": "3.4.15",
-    "vite": "4.3.3"
+    "vite": "6.3.2"
  },
  "release-it": {
    "git": {
@@ -42,20 +41,22 @@
    }
  },
  "dependencies": {
+    "@bwip-js/browser": "^4.6.0",
    "@fontsource/athiti": "^5.2.5",
-    "@odit/lfk-client-js": "1.2.0",
+    "@odit/lfk-client-js": "1.2.4",
    "@paralleldrive/cuid2": "2.2.2",
+    "@tailwindcss/vite": "^4.1.4",
    "@tanstack/svelte-table": "8.9.1",
-    "bwip-js": "3.4.0",
    "check-password-strength": "2.0.10",
-    "csvtojson": "2.0.10",
    "html5-qrcode": "^2.3.8",
    "localforage": "1.10.0",
-    "marked": "4.3.0",
+    "papaparse": "^5.5.2",
    "svelte": "3.58.0",
    "svelte-french-toast": "1.2.0",
-    "svelte-i18n": "3.6.0",
+    "svelte-i18n": "4.0.1",
+    "tailwindcss": "^4.1.4",
    "tinro": "0.6.12",
+    "underscore": "^1.13.7",
    "validator": "13.15.0",
    "xlsx": "0.18.5"
  },
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/postcss.config.cjs
+++ b/postcss.config.cjs
@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};
--- a/public/beep.mp3
+++ b/public/beep.mp3
--- a/public/licenses.json
+++ b/public/licenses.json
--- a/public/privacy_en.md
+++ b/public/privacy_en.md
@@ -1 +0,0 @@
-Nostrud tempor dolor aute ea excepteur aute mollit elit eiusmod exercitation. Magna laborum pariatur adipisicing pariatur cupidatat exercitation duis aliquip pariatur sint exercitation deserunt labore. Consectetur id laboris dolore nostrud do velit ipsum. Eu laboris velit do commodo ad ea sint ex cillum. Cillum ipsum qui eiusmod laborum mollit sunt dolore incididunt. Cillum sunt culpa veniam voluptate et qui ut magna anim occaecat ut mollit dolor. Duis irure proident eu incididunt dolore sunt nisi aute dolore amet eu fugiat laboris quis.
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -54,8 +54,6 @@
  import UserPermissions from "./components/users/UserPermissions.svelte";
  import GroupPermissions from "./components/groups/GroupPermissions.svelte";
  import RunnerDetail from "./components/runners/RunnerDetail.svelte";
-  import Imprint from "./components/general/Imprint.svelte";
-  import Privacy from "./components/general/Privacy.svelte";
  import ResetPassword from "./components/auth/ResetPassword.svelte";
  import Contacts from "./components/contacts/Contacts.svelte";
  import ContactDetail from "./components/contacts/ContactDetail.svelte";
@@ -88,14 +86,6 @@
    <Route path="/about">
      <About />
    </Route>
-  {:else if $router.path === "/imprint"}
-    <Route path="/imprint">
-      <Imprint />
-    </Route>
-  {:else if $router.path === "/privacy"}
-    <Route path="/privacy">
-      <Privacy />
-    </Route>
  {:else if $store.isLoggedIn}
    <Dashboard>
      <Transition>
@@ -136,7 +126,7 @@
        </Route>
        <Route path="/runners/*">
          <Route path="/">
-            <Runners />
+            <Runners created_via="all" />
          </Route>
          <Route path="/:runnerid" let:params>
            <RunnerDetail {params} />
--- a/src/components/base/PromiseError.svelte
+++ b/src/components/base/PromiseError.svelte
@@ -5,7 +5,7 @@

 <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
  <span class="inline-block align-middle mr-8">
-    <b class="capitalize">{$_("general_promise_error")}</b>
+    <b>{$_("general_promise_error")}</b>
    {error}
  </span>
 </div>
--- a/src/components/cards/AddCardBulkModal.svelte
+++ b/src/components/cards/AddCardBulkModal.svelte
@@ -111,7 +111,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-2xl sm:w-full"
+        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-2xl sm:w-full relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/cards/AddCardModal.svelte
+++ b/src/components/cards/AddCardModal.svelte
@@ -104,7 +104,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -148,7 +148,7 @@
                    >{$_("runner")}</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      filterRunners(label, filterText, option)}
                    items={runners}
--- a/src/components/cards/CardDetailModal.svelte
+++ b/src/components/cards/CardDetailModal.svelte
@@ -98,7 +98,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -139,7 +139,7 @@
                    >{$_("runner")}</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      filterRunners(label, filterText, option)}
                    items={runners}
--- a/src/components/cards/CardRunner.svelte
+++ b/src/components/cards/CardRunner.svelte
@@ -6,7 +6,7 @@
 {#if !runner}
  {$_("non-blanko")}
 {:else}
-  <a href={`/runners/${runner.id}`}>
+  <a class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full border border-current bg-blue-100 text-blue-800" href={`/runners/${runner.id}`}>
    {#if runner.middlename}
      {runner.firstname} {runner.middlename} {runner.lastname}
    {:else}
--- a/src/components/cards/DeleteCardModal.svelte
+++ b/src/components/cards/DeleteCardModal.svelte
@@ -54,7 +54,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/contacts/AddContactModal.svelte
+++ b/src/components/contacts/AddContactModal.svelte
@@ -156,7 +156,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/contacts/ContactsOverview.svelte
+++ b/src/components/contacts/ContactsOverview.svelte
@@ -190,7 +190,7 @@
 	{:catch error}
 		<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
 			<span class="inline-block align-middle mr-8">
-				<b class="capitalize">{$_("general_promise_error")}</b>
+				<b>{$_("general_promise_error")}</b>
 				{error}
 			</span>
 		</div>
--- a/src/components/dashboard/Dashboard.svelte
+++ b/src/components/dashboard/Dashboard.svelte
@@ -41,7 +41,27 @@
 				</svg>
 				<span>{$_("dashboard-title")}</span>
 			</a>
-			{#if store.state.jwtinfo.userdetails.permissions.includes("RUNNER:GET")}
+			{#if store.state.jwtinfo.userdetails.permissions.includes("RUNNER:GET") && store.state.jwtinfo.userdetails.permissions.includes("CARD:GET")}
+				<a
+					class:activenav={$router.path.includes("/cardassignment/")}
+					class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-200 hover:text-gray-900 w-full font-semibold"
+					href="/cardassignment/"
+				>
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						viewBox="0 0 24 24"
+						fill="currentColor"
+						class="flex-shrink-0 w-5 h-5 mr-2 transition group-hover:text-gray-600"
+					>
+						<path
+							fill-rule="evenodd"
+							d="M14.615 1.595a.75.75 0 0 1 .359.852L12.982 9.75h7.268a.75.75 0 0 1 .548 1.262l-10.5 11.25a.75.75 0 0 1-1.272-.71l1.992-7.302H3.75a.75.75 0 0 1-.548-1.262l10.5-11.25a.75.75 0 0 1 .913-.143Z"
+							clip-rule="evenodd"
+						/>
+					</svg>
+
+					<span>{$_('card_assignment_menu')}</span>
+				</a>
 				<a
 					class:activenav={$router.path.includes("/runners/")}
 					class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-200 hover:text-gray-900 w-full font-semibold"
--- a/src/components/dashboard/MainDashContent.svelte
+++ b/src/components/dashboard/MainDashContent.svelte
@@ -234,11 +234,28 @@
 					/></svg
 				>
 			</StatCard>
+			<StatCard
+				title={$_('runners_via_kiosk')}
+				value={stats.runnersViaKiosk}
+				href="/runners/"
+			>
+				<svg
+					height="24"
+					width="24"
+					fill="currentColor"
+					xmlns="http://www.w3.org/2000/svg"
+					viewBox="0 0 24 24"
+					><path d="M0 0h24v24H0z" fill="none" />
+					<path
+						d="M13.49 5.48c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm-3.6 13.9l1-4.4 2.1 2v6h2v-7.5l-2.1-2 .6-3c1.3 1.5 3.3 2.5 5.5 2.5v-2c-1.9 0-3.5-1-4.3-2.4l-1-1.6c-.4-.6-1-1-1.7-1-.3 0-.5.1-.8.1l-5.2 2.2v4.7h2v-3.4l1.8-.7-1.6 8.1-4.9-1-.4 2 7 1.4z"
+					/></svg
+				>
+			</StatCard>
 		</div>
 	{:catch error}
 		<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
 			<span class="inline-block align-middle mr-8">
-				<b class="capitalize">{$_("general_promise_error")}</b>
+				<b>{$_("general_promise_error")}</b>
 				{error}
 			</span>
 		</div>
--- a/src/components/donations/AddDonationModal.svelte
+++ b/src/components/donations/AddDonationModal.svelte
@@ -135,7 +135,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -192,7 +192,7 @@
                    >{$_("donor")}</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      filterDonors(label, filterText, option)}
                    items={donors}
@@ -212,7 +212,7 @@
                      >{$_("runner")}</label
                    >
                    <Select
-                      containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                      containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                      itemFilter={(label, filterText, option) =>
                        filterDonors(label, filterText, option)}
                      items={runners}
--- a/src/components/donations/AddDonationPaymentModal.svelte
+++ b/src/components/donations/AddDonationPaymentModal.svelte
@@ -96,7 +96,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/donations/DeleteDonationModal.svelte
+++ b/src/components/donations/DeleteDonationModal.svelte
@@ -57,7 +57,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/donations/DonationDetail.svelte
+++ b/src/components/donations/DonationDetail.svelte
@@ -236,7 +236,7 @@
 				>{$_("donor")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					filterDonors(label, filterText, option)}
 				items={current_donors}
@@ -259,7 +259,7 @@
 					>{$_("runner")}</label
 				>
 				<Select
-					containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+					containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 					itemFilter={(label, filterText, option) =>
 						filterDonors(label, filterText, option)}
 					items={current_runners}
--- a/src/components/donors/AddDonorModal.svelte
+++ b/src/components/donors/AddDonorModal.svelte
@@ -144,7 +144,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/donors/ConfirmDonorDeletion.svelte
+++ b/src/components/donors/ConfirmDonorDeletion.svelte
@@ -34,7 +34,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
--- a/src/components/general/About.svelte
+++ b/src/components/general/About.svelte
@@ -44,7 +44,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -158,7 +158,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b class="capitalize">{$_("general_promise_error")}</b>
+					<b>{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>
--- a/src/components/general/CardAssignment.svelte
+++ b/src/components/general/CardAssignment.svelte
@@ -1,70 +1,497 @@
 <script>
+	import { _ } from "svelte-i18n";
+	import { RunnerCardService, RunnerService } from "@odit/lfk-client-js";
 	import QrCodeScanner from "./QrCodeScanner.svelte";
 	let state = "scan_runner";
-	let runnerID = undefined;
-	let cardInfo = "";
+	let runnerinfo = { id: 0, firstname: "", lastname: "" };
+	let cardCode = "";
+	let scannerActive = true;
+	function resetAll() {
+		state = "scan_runner";
+		runnerinfo = { id: 0, firstname: "", lastname: "" };
+		cardCode = "";
+		scannerActive = true;
+	}
 </script>

 <div class="p-4">
-	<h3 class="text-3xl font-bold">Card Assignment for Mobile</h3>
+	<h3 class="text-3xl font-bold">{$_("card_assignment_for_mobile")}</h3>
 	{#if state === "done"}
-		<p>Assigned Card {cardInfo} ✅</p>
-		<p>(not really, needs to be implemented)</p>
+		<div class="text-center mx-auto">
+			<svg
+				class="h-64 mx-auto"
+				xmlns="http://www.w3.org/2000/svg"
+				viewBox="0 0 500 500"
+				><path
+					d="m339.91 38.77-2 1.14c-16.77 9.58-27.19 27.41-26.49 46.53a50.12 50.12 0 0 0 .81 7.33 54.34 54.34 0 0 0 32.62 39.6c9.79 3.94 21.14 5.27 28.8 12.46 10 9.36 9.88 24.8 9.1 38.36s-.83 29 9.18 38.32c6.27 5.84 15.36 7.88 24 7.65 22.8-.61 43.57-15.93 54.22-35.83s12.18-43.63 8.31-65.82c-5.46-31.09-21.78-60.95-47.75-79.33s-61.88-23.8-90.8-10.41ZM152.06 393l2.36-.64c19.89-5.4 35.44-21 39.85-41a55.18 55.18 0 0 0 1.13-7.79 58 58 0 0 0-23.09-49.67c-9.05-6.7-20.43-11.12-26.42-20.6-7.79-12.35-3.56-28.28.89-42.08s8.63-29.75.79-42.07c-4.91-7.71-13.75-12.25-22.71-14.32-23.71-5.49-49.29 4.77-65.63 22.48S34.94 239.14 33 263.11c-2.74 33.57 6.14 68.81 28.05 94.77s57.54 41.19 91.01 35.12Z"
+					style="fill:#f5f5f5"
+				/><circle
+					cx="409.16"
+					cy="320.55"
+					r="36.72"
+					style="fill:#f5f5f5"
+					transform="rotate(-45 409.165 320.548)"
+				/><path
+					d="M470.34 473.11c0 .15-98.66.26-220.33.26s-220.35-.11-220.35-.26 98.64-.26 220.35-.26 220.33.15 220.33.26Z"
+					style="fill:#263238"
+				/><path
+					d="M453.56 473.11a9.53 9.53 0 0 1-1-2c-.54-1.27-1.24-3-2-5s-1.4-3.53-2-5a14.87 14.87 0 0 1-.8-2.09 7.37 7.37 0 0 1 1.14 1.93c.61 1.25 1.36 3 2.13 5s1.42 3.75 1.87 5a10.55 10.55 0 0 1 .66 2.16ZM458.16 473.31c-.15 0-.66-3.33-1.59-7.41s-1.9-7.32-1.76-7.37a8.61 8.61 0 0 1 .84 2.07c.44 1.31 1 3.14 1.43 5.19s.77 3.93.94 5.29a8.54 8.54 0 0 1 .14 2.23ZM466.32 459.42c.14.08-1.36 3.08-2.88 6.91s-2.51 7-2.66 7a9.06 9.06 0 0 1 .46-2.15 53.35 53.35 0 0 1 3.93-9.86 8.66 8.66 0 0 1 1.15-1.9ZM225.88 473.11a74 74 0 0 1-6.08-10.68 71.59 71.59 0 0 1 6.08 10.68ZM230.2 473a79 79 0 0 1-2.66-12.67A82 82 0 0 1 230.2 473ZM239.31 461.69a39.45 39.45 0 0 1-3.08 5.76 41.06 41.06 0 0 1-3.53 5.49 39.66 39.66 0 0 1 3.08-5.75 42.46 42.46 0 0 1 3.53-5.5ZM55.68 473.11a29 29 0 0 1-2.94-4.68 29 29 0 0 1-2.49-4.93 29.84 29.84 0 0 1 2.94 4.68 29.92 29.92 0 0 1 2.49 4.93ZM58.09 457.6a60.92 60.92 0 0 1 1.17 7.73 56.51 56.51 0 0 1 .64 7.78 118.57 118.57 0 0 1-1.81-15.51ZM67.49 462.53a29.15 29.15 0 0 1-1.38 5.37 29.37 29.37 0 0 1-1.88 5.21 29.37 29.37 0 0 1 1.38-5.36 31.72 31.72 0 0 1 1.88-5.22Z"
+					style="fill:#263238"
+				/><path
+					d="M141.72 440a6.16 6.16 0 0 1 3.2 3.62 11 11 0 0 1 .43 4.91c-.37 3.19-2.18 6.4-4.12 8.95-2.69-2.34-3.3-6.43-3.49-8.52-.29-3.31 1.2-9.46 4-9M144.34 462.69a5.24 5.24 0 0 1 1.71-5 7 7 0 0 1 5.15-1.61 2.94 2.94 0 0 1 2.27 1 2.26 2.26 0 0 1 0 2.29 4.49 4.49 0 0 1-1.69 1.66c-2.32 1.46-4.84 2.44-7.47 1.65"
+					style="fill:#455a64"
+				/><path
+					d="M140.9 472.46a4.38 4.38 0 0 1 .1-.65c.08-.46.19-1.06.32-1.77a18.5 18.5 0 0 1 1.83-5.65 11.28 11.28 0 0 1 4.06-4.31 7.33 7.33 0 0 1 1.65-.73 3 3 0 0 1 .48-.12h.17a11.36 11.36 0 0 0-2.22 1 11.75 11.75 0 0 0-3.94 4.28 20.19 20.19 0 0 0-1.87 5.57c-.16.74-.29 1.34-.39 1.76a2.49 2.49 0 0 1-.19.62Z"
+					style="fill:#263238"
+				/><path
+					d="M141 444.74a1.36 1.36 0 0 1 0 .29l.05.82c0 .71.08 1.74.12 3 .08 2.55.14 6.08.13 10s-.11 7.42-.22 10c-.05 1.28-.1 2.31-.15 3 0 .33 0 .6-.05.82a1.33 1.33 0 0 1 0 .28 1.29 1.29 0 0 1 0-.29v-.82c0-.74.05-1.77.08-3 .06-2.55.13-6.08.15-10s0-7.42-.07-10V445c-.04-.16-.04-.26-.04-.26Z"
+					style="fill:#263238"
+				/><path
+					d="M139.7 464.63a12.32 12.32 0 0 0-6.72-9c-.9-.43-2.07-.71-2.81 0s-.57 1.86-.21 2.79a10.54 10.54 0 0 0 9.68 6.54"
+					style="fill:#455a64"
+				/><path
+					d="M133.41 458.63a3 3 0 0 1 .57.25 5.17 5.17 0 0 1 .64.34 9.69 9.69 0 0 1 .82.52 9.89 9.89 0 0 1 .94.7 11.62 11.62 0 0 1 1 .91 13.72 13.72 0 0 1 1.89 2.43 14 14 0 0 1 1.25 2.82 10.26 10.26 0 0 1 .31 1.31 9.15 9.15 0 0 1 .16 1.16 8.75 8.75 0 0 1 0 1v.73a4 4 0 0 1-.07.62s0-.89-.12-2.3a10.83 10.83 0 0 0-.19-1.14 11.51 11.51 0 0 0-.33-1.28 13.92 13.92 0 0 0-1.24-2.77 14.19 14.19 0 0 0-1.85-2.4 10.11 10.11 0 0 0-1-.91 10.49 10.49 0 0 0-.9-.72c-1.1-.9-1.9-1.22-1.88-1.27Z"
+					style="fill:#263238"
+				/><path
+					d="M411.83 430.38a8.16 8.16 0 0 1 4.22 4.79 14.35 14.35 0 0 1 .57 6.48c-.48 4.21-2.87 8.46-5.45 11.82-3.54-3.09-4.35-8.49-4.6-11.25-.38-4.36 1.58-12.49 5.26-11.84M415.29 460.41a7 7 0 0 1 2.25-6.61 9.26 9.26 0 0 1 6.81-2.13 3.89 3.89 0 0 1 3 1.35 3 3 0 0 1 .05 3 6 6 0 0 1-2.23 2.2c-3.07 1.93-6.4 3.23-9.87 2.18"
+					style="fill:#455a64"
+				/><path
+					d="M410.75 473.31a5.31 5.31 0 0 1 .13-.86l.42-2.34a24.66 24.66 0 0 1 2.42-7.46 14.9 14.9 0 0 1 5.35-5.69 10.1 10.1 0 0 1 2.19-1 6.47 6.47 0 0 1 .63-.16.61.61 0 0 1 .22 0 13.81 13.81 0 0 0-8.13 7 26.37 26.37 0 0 0-2.46 7.36c-.22 1-.39 1.77-.53 2.32a4.05 4.05 0 0 1-.24.83Z"
+					style="fill:#263238"
+				/><path
+					d="M410.88 436.7a1.65 1.65 0 0 1 .05.38q0 .42.06 1.08c.05.94.11 2.31.16 4 .11 3.38.19 8 .17 13.18s-.15 9.81-.28 13.18c-.07 1.69-.14 3.05-.2 4 0 .44 0 .8-.07 1.08a1.65 1.65 0 0 1 0 .38 2.21 2.21 0 0 1 0-.38v-1.08c0-1 .06-2.34.1-4 .08-3.37.17-8 .2-13.17s0-9.8-.09-13.17c0-1.66 0-3-.06-4v-1.09a2.79 2.79 0 0 1-.04-.39Z"
+					style="fill:#263238"
+				/><path
+					d="M409.16 463a16.22 16.22 0 0 0-8.88-11.92c-1.19-.57-2.73-.94-3.71-.06s-.75 2.46-.28 3.69a13.9 13.9 0 0 0 12.79 8.63"
+					style="fill:#455a64"
+				/><path
+					d="M400.85 455.05a3.47 3.47 0 0 1 .75.32 9.58 9.58 0 0 1 .85.46 10.94 10.94 0 0 1 1.08.68 12.91 12.91 0 0 1 1.24.93 15.58 15.58 0 0 1 1.32 1.19 16.82 16.82 0 0 1 4.15 6.94 16.17 16.17 0 0 1 .42 1.74 13.28 13.28 0 0 1 .21 1.53c.06.47 0 .9.06 1.28a9.24 9.24 0 0 1 0 1 4.38 4.38 0 0 1-.09.81c-.07 0 .05-1.17-.16-3-.06-.46-.12-1-.24-1.51s-.27-1.1-.44-1.69a18.46 18.46 0 0 0-1.64-3.65 19.56 19.56 0 0 0-2.44-3.18 17.44 17.44 0 0 0-1.28-1.2c-.41-.37-.83-.67-1.2-.95-1.55-1.16-2.62-1.64-2.59-1.7ZM155.45 292c0 .14-14 .26-31.2.26S93 292.15 93 292s14-.26 31.21-.26 31.24.12 31.24.26ZM136.75 284.1c0 .14-14 .26-31.2.26s-31.21-.12-31.21-.26 14-.26 31.21-.26 31.2.16 31.2.26ZM294.43 412.9c0 .14-8.07.26-18 .26s-18-.12-18-.26 8.06-.26 18-.26 18 .12 18 .26ZM283.64 405c0 .15-8.07.26-18 .26s-18-.11-18-.26 8.06-.26 18-.26 18 .11 18 .26Z"
+					style="fill:#263238"
+				/><circle cx="88.02" cy="72.37" r="14.66" style="fill:#5e9cff" /><path
+					d="M88 87a14.68 14.68 0 0 1-13.52-9 14.78 14.78 0 0 1 0-11.43A14.84 14.84 0 0 1 77.64 62a14.69 14.69 0 0 1 20.76 0 14.84 14.84 0 0 1 3.14 4.66A14.67 14.67 0 0 1 88 87ZM85.93 105.14c-.08 0-.15-2.7-.15-6s.07-6 .15-6a56.83 56.83 0 0 1 .16 6 56.56 56.56 0 0 1-.16 6Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M85.93 105.16s-.08 0-.12-1.79v-8.55c0-1.78.09-1.78.12-1.78s.08 0 .13 1.78v8.55c-.06 1.79-.06 1.79-.13 1.79Zm0-12.08c-.07.22-.14 2.52-.14 6s.07 5.79.14 6c.07-.23.14-2.52.14-6s-.07-5.78-.14-6ZM77.48 89.64a63 63 0 0 1-3.07 5.64c-1.78 3.08-3.28 5.53-3.35 5.49a63.32 63.32 0 0 1 3.08-5.64c1.77-3.07 3.27-5.53 3.34-5.49Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M71.06 100.79s-.07 0 .84-1.7c.58-1.07 1.38-2.47 2.23-4s1.68-2.87 2.32-3.91c.89-1.46 1-1.58 1-1.58s.07 0-.84 1.7c-.58 1.07-1.37 2.48-2.23 4-1.52 2.64-3.22 5.46-3.35 5.5Zm6.41-11.12c-.18.17-1.46 2.25-3.32 5.47s-3 5.36-3.08 5.61c.18-.18 1.46-2.25 3.32-5.47s3.02-5.37 3.08-5.61ZM68.81 84.24a31 31 0 0 1-3.42 2.92 32.1 32.1 0 0 1-3.61 2.68 32.32 32.32 0 0 1 3.42-2.92 35.42 35.42 0 0 1 3.61-2.68Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M61.78 89.86s0-.06 1-.93c.65-.55 1.52-1.26 2.46-2a35.08 35.08 0 0 1 3.62-2.68 34.93 34.93 0 0 1-3.43 2.92c-.94.75-1.83 1.44-2.52 2a5 5 0 0 1-1.13.69Zm7-5.6a38.16 38.16 0 0 0-3.59 2.67 40.2 40.2 0 0 0-3.42 2.9 37.22 37.22 0 0 0 3.59-2.68 39.77 39.77 0 0 0 3.44-2.89Zm0 0ZM100.56 99.19a7.77 7.77 0 0 1-.39-1.49c-.21-.92-.51-2.19-.89-3.59s-.75-2.64-1-3.55a8.5 8.5 0 0 1-.41-1.48 7.14 7.14 0 0 1 .62 1.41c.33.89.75 2.14 1.12 3.54a36.32 36.32 0 0 1 .8 3.63 6.9 6.9 0 0 1 .15 1.53Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M100.55 99.2s-.11-.22-.4-1.5c-.19-.86-.5-2.16-.88-3.58s-.78-2.72-1-3.55c-.37-1.2-.45-1.46-.4-1.48s0 0 .22.37.27.64.42 1c.23.6.68 1.87 1.13 3.54s.69 3 .8 3.62a7.38 7.38 0 0 1 .17 1.54Zm-2.7-10.09a13.79 13.79 0 0 0 .41 1.43c.26.83.65 2.1 1 3.55s.69 2.73.88 3.59.32 1.37.37 1.46a10.18 10.18 0 0 0-.18-1.5c-.11-.64-.35-2-.8-3.62s-.9-2.94-1.13-3.54a9.12 9.12 0 0 0-.55-1.37ZM115.42 88.64a54.77 54.77 0 0 1-4.33-3.58 51.8 51.8 0 0 1-4.09-3.82 50.82 50.82 0 0 1 4.33 3.58 49.69 49.69 0 0 1 4.09 3.82Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M115.42 88.65a54.61 54.61 0 0 1-4.34-3.58c-1.13-1-2.18-1.93-3-2.65-1.22-1.13-1.19-1.17-1.17-1.19.15 0 2.34 1.85 4.33 3.59 1.13 1 2.19 1.93 3 2.65 1.22 1.13 1.18 1.17 1.16 1.19ZM107 81.26c.11.18 1.67 1.64 4.12 3.78s4.11 3.5 4.3 3.58c-.1-.19-1.67-1.64-4.12-3.79s-4.12-3.49-4.3-3.57ZM121.12 74.14a11.91 11.91 0 0 1-1.77-.26c-1.09-.18-2.59-.41-4.25-.6s-3.19-.3-4.29-.37a10.88 10.88 0 0 1-1.78-.16 8.74 8.74 0 0 1 1.79-.06 43.17 43.17 0 0 1 4.31.28c1.68.2 3.18.46 4.26.7a9.11 9.11 0 0 1 1.73.47Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M121.07 74.16c-.13 0-.49-.06-1.37-.2l-.35-.06c-1.49-.25-2.92-.45-4.26-.61s-2.77-.27-4.28-.37h-.35c-1.2-.08-1.44-.1-1.44-.15a9.68 9.68 0 0 1 1.79-.07 42.81 42.81 0 0 1 4.31.29 41.81 41.81 0 0 1 4.26.7 9.36 9.36 0 0 1 1.74.47s-.01 0-.05 0Zm-12-1.41a13.35 13.35 0 0 0 1.41.12h.35c1.51.1 3 .22 4.28.37s2.77.36 4.25.61l.35.06c.71.12 1.24.2 1.37.2a12.87 12.87 0 0 0-1.7-.44 41.81 41.81 0 0 0-4.26-.7 43 43 0 0 0-4.31-.29 13.47 13.47 0 0 0-1.75.07ZM121.14 59.88c0 .08-3.16.93-7.09 1.89s-7.14 1.66-7.16 1.58 3.15-.92 7.09-1.88 7.14-1.67 7.16-1.59Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M106.92 63.37s0-.08 2.07-.64c1.34-.35 3.13-.8 5-1.27s3.7-.88 5-1.18c2.11-.47 2.13-.42 2.13-.39s0 .07-2.07.63c-1.34.36-3.12.81-5 1.27s-3.69.88-5 1.18a16 16 0 0 1-2.13.4Zm14.18-3.48c-.29 0-3 .59-7.12 1.59s-6.8 1.73-7.06 1.86c.29 0 3-.58 7.13-1.59s6.8-1.75 7.05-1.86ZM104.57 43.27a63.61 63.61 0 0 1-3.39 5.41c-1.94 2.94-3.58 5.29-3.65 5.24s1.45-2.47 3.39-5.41 3.58-5.29 3.65-5.24Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M97.53 53.93c0-.14 1.72-2.9 3.39-5.42.94-1.42 1.84-2.75 2.53-3.74 1.06-1.52 1.12-1.52 1.14-1.5s.07 0-.93 1.64c-.65 1-1.52 2.37-2.46 3.79s-1.83 2.75-2.52 3.74c-.98 1.37-1.11 1.49-1.15 1.49Zm7-10.64c-.19.17-1.59 2.15-3.62 5.23s-3.32 5.14-3.39 5.37c.19-.16 1.58-2.14 3.62-5.22s3.34-5.14 3.42-5.38ZM88.13 39.8a12.88 12.88 0 0 1 0 2v4.85c0 1.85 0 3.61.06 4.85a14.66 14.66 0 0 1 0 2 11.36 11.36 0 0 1-.2-2c-.08-1.24-.14-3-.14-4.86s0-3.61.13-4.86a12.13 12.13 0 0 1 .15-1.98Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M88.15 53.54s-.05 0-.1-.55-.08-.88-.12-1.47c-.05-.84-.14-2.58-.14-4.86s.08-4 .13-4.86c0-.59.07-1.09.11-1.47s.08-.55.1-.55c.05 0 .07.19 0 2v4.85c0 1.91 0 3.54.05 4.77v2.08Zm0-13.71a18 18 0 0 0-.18 2c0 .83-.13 2.58-.13 4.85s.09 4 .14 4.86a16.64 16.64 0 0 0 .19 2v-2.08c0-1.23-.05-2.92-.05-4.77v-4.85c.03-.76.05-1.84.01-2.01ZM75.68 55.3c-.07.05-1.61-2.35-3.44-5.34s-3.24-5.47-3.19-5.51 1.62 2.35 3.45 5.35a63 63 0 0 1 3.18 5.5Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M75.68 55.32s-.16-.12-1.07-1.54c-.65-1-1.5-2.37-2.39-3.82-1.57-2.57-3.22-5.37-3.22-5.51s.07 0 1.09 1.54c.65 1 1.5 2.37 2.38 3.82s1.71 2.82 2.31 3.86c.94 1.63.9 1.65.87 1.67Zm-6.61-10.85c.06.24 1.26 2.34 3.18 5.48s3.24 5.16 3.42 5.33c-.07-.24-1.26-2.34-3.18-5.48s-3.24-5.16-3.42-5.33ZM68.25 61.62a7 7 0 0 1-1.56-.24c-1-.2-2.26-.52-3.69-.94s-2.7-.87-3.6-1.21a7.56 7.56 0 0 1-1.4-.64 8.28 8.28 0 0 1 1.52.43c.92.3 2.2.7 3.62 1.12s2.71.77 3.65 1a9.86 9.86 0 0 1 1.46.48Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M68.2 61.65h-.38c-.29 0-.68-.12-1.13-.22-.65-.13-2-.44-3.69-.94s-3-1-3.61-1.21l-1.07-.44c-.4-.17-.39-.2-.38-.22s.22 0 1.53.42c.74.24 2.12.68 3.62 1.13s2.6.74 3.65 1c1.34.36 1.53.43 1.52.48s0 0-.06 0ZM58 58.6a9.9 9.9 0 0 0 1.42.61c.62.24 1.9.71 3.61 1.21s3 .81 3.68.94a10.47 10.47 0 0 0 1.51.26 15.06 15.06 0 0 0-1.48-.44c-1-.28-2.29-.62-3.65-1s-2.89-.91-3.63-1.18c-.58-.15-1.36-.4-1.46-.4ZM65 72.89a38 38 0 0 1-4.68.6 37.31 37.31 0 0 1-4.71.3 35.07 35.07 0 0 1 4.68-.61 34.11 34.11 0 0 1 4.71-.29Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M55.88 73.83a1 1 0 0 1-.27 0 39.32 39.32 0 0 1 4.69-.6 39.75 39.75 0 0 1 4.72-.3 40.29 40.29 0 0 1-4.69.61c-1.81.14-3.74.29-4.45.29Zm-.24 0a43.5 43.5 0 0 0 4.68-.31 46 46 0 0 0 4.68-.63 43.61 43.61 0 0 0-4.69.31 39.33 39.33 0 0 0-4.67.59Z"
+					style="fill:#5e9cff"
+				/><path
+					d="m321.8 444.95 7.41 19.13 16.31-3.83 3.59-8.75-5.52-18.14-21.79 11.59z"
+					style="fill:#ffbf9d"
+				/><path
+					d="m349.94 449.25.58 1.45s29 0 31.09 4.61l-49.89 19.33-5.66-16.58c8.73.5 16.64-2.13 23.88-8.81Z"
+					style="fill:#455a64"
+				/><g style="opacity:.6000000000000001"
+					><path
+						d="M333.13 461.32a2.15 2.15 0 0 0-.52 2.83 2.11 2.11 0 0 0 2.84.5 2.25 2.25 0 0 0 .53-3 2.19 2.19 0 0 0-3-.2"
+						style="fill:#fff"
+					/></g
+				><g style="opacity:.6000000000000001"
+					><path
+						d="m331.72 474.64-1.36-4 48.32-17.07s2.59.09 2.93 1.73Z"
+						style="fill:#fff"
+					/></g
+				><path
+					d="M350.75 450.77c.08.24-1.1.82-2 2.06s-1.15 2.48-1.41 2.48-.44-1.54.68-3 2.69-1.78 2.73-1.54ZM356.81 450.87c.14.21-.76 1-1.19 2.36s-.26 2.5-.5 2.58-.93-1.21-.36-2.86 1.95-2.31 2.05-2.08ZM362.17 455.87c-.2.14-1-.93-.89-2.48s1.05-2.52 1.23-2.36-.25 1.14-.32 2.41.21 2.32-.02 2.43ZM259.73 325.23c.43 1.14 27.19 31 33.15 39.7 6.74 9.84 8.16 18.16 8.49 20.11 1.86 11.15 3.25 19 8.31 31.15S324.73 454 324.73 454l23.63-6.09s-13.93-59.44-15.19-69.34-3.38-17.57-8.87-26.67-29.71-58.77-29.71-58.77l-38.28 16.09Z"
+					style="fill:#263238"
+				/><path
+					d="M242.57 240.76s7.74.11 8.88.82 5.69 4.21 5.69 5a3 3 0 0 0 .32 1.38s2.86 4 1.57 5.71-2.24 2.27-2.21 2.8-.38 2.37-1.47 2.87a10.78 10.78 0 0 0-2.88 1.84 10.63 10.63 0 0 1-1.73 2.06 10.75 10.75 0 0 1-2.48 1.15 2.92 2.92 0 0 1-2.55 1.57c-1.64-.15-4.63-3.27-5.6-4.43-1.21-1.45-4.29-4-4.69-5.29a14.76 14.76 0 0 0-.92-2.3l-7.5-7.09 11.7-11.75Z"
+					style="fill:#ffbf9d"
+				/><path
+					d="M257.7 248.6a20.35 20.35 0 0 1-2.46-2.31 19.31 19.31 0 0 1-2.41-2.36 11.74 11.74 0 0 1 4.87 4.67Z"
+					style="fill:#ff9a6c"
+				/><path
+					d="M238.46 161.84s-8.9 7.54-11 9.43-29.46 24.87-31.29 35.27c-1.16 6.66 4 11.87 6.77 16.24 2 3.26 14.32 25.66 25.83 26.31.68 0 4.15 4.28 4.15 4.28l12.49-10.65a52.68 52.68 0 0 1-4.73-7c-5-9.38-15.89-24-15.55-24.66 2.43-4.55-3.34-3.47-3.34-3.47l23.94-21.95Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M198.89 199.64s-1.73-3.09 0-5.67S225 171.68 225 171.68s1.19.31 2.06 2.27-27 26.62-27 26.62Z"
+					style="fill:#263238"
+				/><path
+					d="M207.41 192.32s14 15.79 16 15.27 11.7-7.84 12.14-10.22-13.33-19-13.33-19ZM187.57 91.83c3.07.73 5.47 3.21 8.28 4.74 5.27 2.86 11.66 2.1 16.68-.23s9.1-6 13.61-9.1 8.09-6.22 14.6-6.81c11.49-1 23 9.11 17.78 17.7l-9.65 3.37a60.17 60.17 0 0 1-25.79 32.32c-2.42 1.47-5.16 2.83-8.17 2.45s-6.07-3.25-5.43-6c-4.78 1-9.7 1.92-14.7 1.17s-10.19-3.54-12.41-8-.26-10.48 4.56-11.35c-4.45-2.73-8.26-7.18-8.54-12s4.18-9.45 9.18-8.26Z"
+					style="fill:#263238"
+				/><path
+					d="M283.46 72.49c-6.22-1.69-12 .21-17.71 3.25a32.78 32.78 0 0 0-16.23 33.58 25.23 25.23 0 0 0 10.86 16.58c7.83 5 18.5 4.54 26.4-.31s13-13.65 14.27-22.84a30.7 30.7 0 0 0-3.05-18.6 23.36 23.36 0 0 0-14.53-11.66"
+					style="fill:#263238"
+				/><path
+					d="M263.37 92.26c1.16-2.33 1.06-5.07 1.68-7.6 1.36-5.57 3.94-10.5 9.42-12.19 5.1-1.57 13.45.3 19.16 2.78a22.62 22.62 0 0 1 9.88 7.9 17.84 17.84 0 0 1 1.71 16.26l-28.5-7c-2.92 2-5.92 4-9.32 4.91a6 6 0 0 1-3.07.19 2.7 2.7 0 0 1-2.06-2.07c-.16-1.15.59-2.17 1.1-3.18Z"
+					style="fill:#263238"
+				/><path
+					d="m257.85 145 5-54.65a4.74 4.74 0 0 1 4.85-4.19l25.76-2.89c8.09.25 12 10.79 11.46 18.86-.65 9-1.81 19.89-3.77 26.38-3.94 13.05-14.39 13.35-14.39 13.35s-.06.52-.78 5.35c0 0-1.31 10-12.46 7.81-7.24-1.42-15.67-10.02-15.67-10.02Z"
+					style="fill:#ffbf9d"
+				/><path
+					d="M300.16 112.56a1.72 1.72 0 0 1-1.88 1.5 1.66 1.66 0 0 1-1.56-1.78 1.75 1.75 0 0 1 1.89-1.51 1.65 1.65 0 0 1 1.55 1.79ZM301.8 107.49c-.24.19-1.41-.94-3.25-1.19s-3.32.49-3.49.24.19-.49.84-.84a4.8 4.8 0 0 1 2.83-.46 4.49 4.49 0 0 1 2.54 1.22c.51.54.65.94.53 1.03ZM284.13 110.14a1.73 1.73 0 0 1-1.89 1.5 1.66 1.66 0 0 1-1.55-1.78 1.74 1.74 0 0 1 1.89-1.51 1.65 1.65 0 0 1 1.55 1.79ZM284.19 104.44c-.24.2-1.41-.94-3.25-1.19s-3.32.49-3.49.24.19-.49.84-.83a4.73 4.73 0 0 1 2.83-.47 4.49 4.49 0 0 1 2.54 1.23c.51.51.65.94.53 1.02ZM288.47 119.93a12.12 12.12 0 0 1 3.06-.14c.48 0 .94 0 1.06-.32a2.42 2.42 0 0 0-.12-1.44c-.29-1.2-.59-2.45-.9-3.77-1.24-5.36-2.06-9.74-1.84-9.79s1.39 4.26 2.62 9.62c.29 1.32.58 2.58.84 3.78a2.7 2.7 0 0 1 0 1.88 1.16 1.16 0 0 1-.86.58 3.79 3.79 0 0 1-.82 0 12.7 12.7 0 0 1-3.04-.4Z"
+					style="fill:#263238"
+				/><path
+					d="M286.76 141.88a34.19 34.19 0 0 1-17.21-7.2s3.23 9.85 16.75 10.42ZM287.09 124.26a3.35 3.35 0 0 0-2.81-1.64 3 3 0 0 0-2.24.83 1.93 1.93 0 0 0-.45 2.18 2.26 2.26 0 0 0 2.33.94 7.25 7.25 0 0 0 2.55-1.08 2.35 2.35 0 0 0 .6-.48.64.64 0 0 0 .09-.68"
+					style="fill:#ff9a6c"
+				/><path
+					d="M282.88 120.46c.3 0 0 2 1.55 3.67s3.67 1.73 3.65 2c0 .13-.53.32-1.43.22a5 5 0 0 1-3.06-1.56 4.31 4.31 0 0 1-1.17-3.06c.03-.84.32-1.3.46-1.27ZM285.77 97.11c-.25.47-2.06 0-4.25 0s-4 .31-4.25-.17c-.1-.24.27-.67 1-1a7.07 7.07 0 0 1 3.26-.67 7.2 7.2 0 0 1 3.21.83c.79.33 1.14.78 1.03 1.01ZM302.37 99.37c-.39.37-1.59-.24-3.12-.47s-2.85-.1-3.09-.58c-.1-.23.16-.62.78-.94a4.55 4.55 0 0 1 5 .84c.48.51.6.96.43 1.15Z"
+					style="fill:#263238"
+				/><path
+					d="M259.12 87.91c3.37-7.43 15.81-16.79 23.82-15.28l12 9.26a12.54 12.54 0 0 1-9.57 8.54c-2.36.42-5.13.29-6.72 2.09s-1.15 4.86-2.69 6.77c-2.12 2.66-7 1.95-8.69 4.89-.75 1.28-.63 2.94-1.4 4.21-1 1.69-5.82 3.43-7.62 2.61s-1.44-4-1.85-5.74a9 9 0 0 1 .42-6c1.26-3.65.7-7.8 2.3-11.35Z"
+					style="fill:#263238"
+				/><path
+					d="M263.59 113.23c.13-1-.7-3.49-1.66-3.78-2.56-.76-7.31-1.2-8.27 5.45-1.3 9.09 8.09 8.52 8.15 8.26s1.32-6.5 1.78-9.93Z"
+					style="fill:#ffbf9d"
+				/><path
+					d="M259.53 119.32s-.18.09-.46.17a1.64 1.64 0 0 1-1.19-.14c-.91-.49-1.5-2.13-1.31-3.78a5.29 5.29 0 0 1 .77-2.2 1.83 1.83 0 0 1 1.36-1 .82.82 0 0 1 .88.56c.08.28 0 .45 0 .47s.22-.12.2-.51a1 1 0 0 0-.28-.62 1.23 1.23 0 0 0-.84-.36 2.24 2.24 0 0 0-1.85 1.18 5.24 5.24 0 0 0-.91 2.45c-.21 1.84.48 3.69 1.74 4.25a1.68 1.68 0 0 0 1.48 0c.36-.25.43-.45.41-.47Z"
+					style="fill:#ff9a6c"
+				/><path
+					d="M292.56 78.87c.48 3.8 5.66 9.12 7.86 12.25 4.19 6 4.95 7.91 3.7 20.24 2.65-4 4.76-8 5.06-12.88a20 20 0 0 0-4-13.6 15.6 15.6 0 0 0-12.61-6"
+					style="fill:#263238"
+				/><path
+					d="M254.48 87.34a9.48 9.48 0 0 0 1.51.54c.49.16 1.1.34 1.82.5s1.52.39 2.44.52a43.13 43.13 0 0 0 6.47.7 49.17 49.17 0 0 0 7.95-.43 48.36 48.36 0 0 0 7.76-1.81 44.66 44.66 0 0 0 6-2.47c.85-.39 1.56-.83 2.2-1.19s1.18-.7 1.6-1a10.08 10.08 0 0 0 1.31-.94 9 9 0 0 0-1.42.76c-.44.26-1 .58-1.64.9s-1.37.75-2.21 1.11a49.36 49.36 0 0 1-6 2.34 52.85 52.85 0 0 1-7.69 1.75 53.22 53.22 0 0 1-7.86.47 47.11 47.11 0 0 1-6.42-.58c-.91-.11-1.72-.3-2.43-.44s-1.33-.28-1.83-.41a8.25 8.25 0 0 0-1.56-.32ZM252.89 93.79a3.74 3.74 0 0 0 1 .36 27.49 27.49 0 0 0 2.91.67 36.71 36.71 0 0 0 19.39-1.88 24.88 24.88 0 0 0 2.81-1.21 3.77 3.77 0 0 0 .94-.55c0-.08-1.44.59-3.8 1.4a41.36 41.36 0 0 1-19.2 1.85c-2.52-.34-4.03-.73-4.05-.64Z"
+					style="fill:#455a64"
+				/><path
+					d="m155.92 343.89-19.68-8-8.49 15.01 4.13 8.92 18.26 6.26 5.78-22.19z"
+					style="fill:#ffbf9d"
+				/><path
+					d="m133 362.05-1.5-.59s-20.27 21.82-25.21 20.16l20.18-51.36 16.53 7.53c-6.47 6.21-10 14.05-10 24.26Z"
+					style="fill:#455a64"
+				/><g style="opacity:.6000000000000001"
+					><path
+						d="M135.6 340.8a2.25 2.25 0 0 0-1.79-2.4 2.14 2.14 0 0 0-2.36 1.78 2.36 2.36 0 0 0 1.9 2.53 2.23 2.23 0 0 0 2.26-2.12"
+						style="fill:#fff"
+					/></g
+				><g style="opacity:.6000000000000001"
+					><path
+						d="m126.48 330.26 4 1.81-20.81 48.57s-1.87 1.89-3.35 1Z"
+						style="fill:#fff"
+					/></g
+				><path
+					d="M131.3 361.58c-.25-.11.13-1.41-.17-3s-1.09-2.64-.9-2.83 1.46.76 1.8 2.65-.53 3.33-.73 3.18ZM127 366.08c-.26 0-.26-1.3-1-2.57s-1.72-2-1.61-2.22 1.57.16 2.42 1.77.42 3.11.19 3.02ZM119.45 366.56c0-.25 1.4-.09 2.5 1.1s1.17 2.58.93 2.6-.69-1-1.6-2-1.91-1.44-1.83-1.7ZM145.78 339.09s15.36 4.19 25.9 6.15 22.64 4.78 31 7c8.81 2.29 12.72 3.59 12.72 3.59s2 2.61 3.5-7.74 6.1-47.73 6.1-47.73l5.06-16.08 30.38-5.32 16.12 21.27s-14.57 47.3-19.53 57.09-12 38.32-29.14 33.87c-10.14-2.63-89.33-27.5-89.33-27.5Z"
+					style="fill:#263238"
+				/><path
+					d="m223.39 313.78-.13 1.06-.33 2.63 23.27-11.21s.15 10.69 22 19l2.78-4.84v-14.16l-16.89-13.13h-11.68l-18.61 14"
+					style="opacity:.30000000000000004"
+				/><path
+					d="M270.41 320.55a72.49 72.49 0 0 1-2.56 8.15 71.37 71.37 0 0 1-3.05 8 70.07 70.07 0 0 1 2.56-8.15 67 67 0 0 1 3.05-8ZM223.88 365.86a37.35 37.35 0 0 0-3.49-5.44 37.33 37.33 0 0 0-4.76-4.36 5.42 5.42 0 0 1 1.7.91 17 17 0 0 1 3.46 3.12 17.56 17.56 0 0 1 2.49 3.93 5.55 5.55 0 0 1 .6 1.84Z"
+					style="fill:#455a64"
+				/><path
+					d="M226.55 272.74s-5.06 13.2-4.88 20.65-2.73 22.38-2.73 22.38 27.33-14.67 29.37-16.45c0 0-2 14.72 21.22 21.58l2 .77 7.13-21.5a68.35 68.35 0 0 0 6.19-12c1.88-5.42 4.5-15.41 4.5-15.41L237.47 258Z"
+					style="fill:#455a64"
+				/><path
+					d="M289.38 287.64s12.76 17.61 12.94 20.49l-32.44 6.43-3-12.36-1.31-12.87Z"
+					style="fill:#455a64"
+				/><path
+					d="M239.86 171.23c.34.94 7 23.93 7 23.93l4 33.37s-6.73 19.75-12.4 26.21c-17.58 20.09-15.68 25.57-15.68 25.57s29.74-8 44.39-5.8 10.66 27.39 32 21.41l-.17-20.54s2.68-18.95 3.35-25.57-.24-30.41-.24-30.41 7.33-23.3 7.33-30.85 1.75-7.88-4.29-18.27-15-24.24-15-24.24l-33.63-2.84-18.64 19.21Z"
+					style="fill:#e0e0e0"
+				/><path
+					d="M281.7 292.51c.13 0-1.75 6.24-4.21 13.83s-4.56 13.72-4.7 13.67 1.75-6.23 4.21-13.83 4.56-13.72 4.7-13.67Z"
+					style="fill:#263238"
+				/><path
+					d="M238.71 172.17c-4.43 1.19-8.35 2.56-13.19 0s-8.89-7.36-9-12.84c-.06-4.48-.07-12.74 3.53-15.41s20.16-5.39 29.43-5.36c35.69.11 40.29 6 46 8.93a5.33 5.33 0 0 1-2.15 5.57"
+					style="fill:#5e9cff"
+				/><path
+					d="M235.67 165.5s1 19.66 2.47 27.09 7.38 29.67 7.38 29.67-3.28 1.23-2.79 5.68c0 0-3.55 3.09-3.95 9.89s1.57 9.76 1.57 9.76l-3.84 7.72 64.36 12.17 1.08-7.27s4.66 3 5.51-11-.82-24.45-.08-37.3 5.53-17.86 4.3-29.47C311 175.62 289.35 147 289.35 147s-31.46-5.35-34.62-1.91-19.06 20.41-19.06 20.41Z"
+					style="fill:#5e9cff"
+				/><path
+					d="M304 226.09c-15.48-8.7-26.72-23.17-37.53-37.27l-1.14-2.82c1.11 5.89 1.42 14.1 2.54 20a72.63 72.63 0 0 0 3.66 14.11 24.45 24.45 0 0 0 8.74 11.42c7 4.61 16.5 3.85 23.85-.1 1.08-.58 2.25-1.45 2.23-2.67s-1.28-2.05-2.35-2.67Z"
+					style="opacity:.30000000000000004"
+				/><path
+					d="M234.28 178.25a10.43 10.43 0 0 1 .6 1.69c.35 1.09.82 2.69 1.37 4.67 1.11 4 2.45 9.48 3.87 15.59s2.72 11.64 3.75 15.61c.51 1.93.93 3.51 1.24 4.71a11.9 11.9 0 0 1 .41 1.74 11.81 11.81 0 0 1-.6-1.69c-.37-1.09-.84-2.68-1.4-4.66-1.13-4-2.5-9.48-3.91-15.59s-2.7-11.64-3.71-15.62c-.5-1.92-.91-3.51-1.22-4.71a12.51 12.51 0 0 1-.4-1.74ZM265.5 233.75a26.55 26.55 0 0 1-3.27-1.23c-2-.79-4.76-1.89-7.89-2.86a49.52 49.52 0 0 0-8.18-1.79c-2.13-.26-3.46-.28-3.46-.37a2.82 2.82 0 0 1 .94-.08 20.82 20.82 0 0 1 2.56.09 39.56 39.56 0 0 1 8.29 1.66 69.24 69.24 0 0 1 7.89 3c1 .45 1.77.82 2.31 1.1a3.61 3.61 0 0 1 .81.48ZM305.27 259.42a4.28 4.28 0 0 1-.58.35 10.73 10.73 0 0 1-1.82.75 18.56 18.56 0 0 1-7.17.46 230.88 230.88 0 0 1-23.22-4.74c-9-2.19-17.11-4.25-23-5.61l-7-1.56-1.91-.42a3.36 3.36 0 0 1-.66-.18 3.14 3.14 0 0 1 .68.08l1.93.32c1.67.29 4.07.77 7 1.4 5.93 1.27 14.07 3.28 23.05 5.47s17.16 4 23.14 4.87a19.12 19.12 0 0 0 7.08-.29 23.9 23.9 0 0 0 2.48-.9Z"
+					style="fill:#263238"
+				/><path
+					d="M227.92 172.83c2.38 4 7.5 5.94 12.14 5.33s8.78-3.37 11.94-6.83 5.46-7.59 7.73-11.68l6.17-11.12c-7.32 3.05-9.81 11.52-15.35 17.2s-16.27 9.44-22.63 7.1"
+					style="opacity:.30000000000000004"
+				/><path
+					d="M266.52 148.59s-.73.18-2 .74a14.62 14.62 0 0 0-4.52 3.43 41.85 41.85 0 0 0-4.84 7 47 47 0 0 1-2.83 4.21 21.16 21.16 0 0 1-3.91 3.82 30.22 30.22 0 0 1-9.38 4.72 25 25 0 0 1-8.49 1.18 12.17 12.17 0 0 1-5.58-1.48 6.62 6.62 0 0 1-1.27-.93 2.54 2.54 0 0 1-.38-.4 18.82 18.82 0 0 0 1.75 1.16 12.65 12.65 0 0 0 5.5 1.28 25.19 25.19 0 0 0 8.33-1.27 30.59 30.59 0 0 0 9.21-4.67 21.42 21.42 0 0 0 3.82-3.72 47.6 47.6 0 0 0 2.82-4.15 40.4 40.4 0 0 1 5-7 14.13 14.13 0 0 1 4.7-3.36 9.15 9.15 0 0 1 1.5-.47 2 2 0 0 1 .57-.09ZM260.76 225.38c-.07.16-3.33-1.38-7.65-2.23a77 77 0 0 0-7.93-.88 8.27 8.27 0 0 1 2.35-.19 29.41 29.41 0 0 1 5.68.56 28.85 28.85 0 0 1 5.45 1.66 8.68 8.68 0 0 1 2.1 1.08ZM243 227.38c.07.07-.77 1-1.77 2.64a19.77 19.77 0 0 0-1.48 3.08 21.77 21.77 0 0 0-1 4.05 21.32 21.32 0 0 0-.16 4.17 20.22 20.22 0 0 0 .55 3.38c.48 1.89 1 3 .94 3a3.32 3.32 0 0 1-.44-.74 7.08 7.08 0 0 1-.41-.93 12.82 12.82 0 0 1-.45-1.26 17.38 17.38 0 0 1-.66-3.44 19.55 19.55 0 0 1 .11-4.29 20.16 20.16 0 0 1 1.1-4.14 17.53 17.53 0 0 1 1.62-3.11 12.25 12.25 0 0 1 .78-1.08 8.48 8.48 0 0 1 .66-.77c.38-.37.61-.58.61-.56Z"
+					style="fill:#263238"
+				/><path
+					d="M234.59 178.76a19.68 19.68 0 0 0 3.4 13.92c-.99-4.68-2.36-9.22-3.4-13.92Z"
+					style="opacity:.30000000000000004"
+				/><path
+					d="M340.48 208.44s5.27-6.17 6.6-6.62 7.22-1.77 7.88-1.22a3.09 3.09 0 0 0 1.33.67s5.11.33 5.66 2.55.34 3.33.78 3.66 1.67 1.89 1.33 3.11a11.48 11.48 0 0 0-.44 3.55 10.77 10.77 0 0 1 .5 2.78 11.39 11.39 0 0 1-.72 2.77 3.08 3.08 0 0 1-.45 3.11c-1.22 1.22-5.73 1.55-7.32 1.56-2 0-6.07.8-7.41.24a16.44 16.44 0 0 0-2.47-.8L335 225.08l-1.66-17.3Z"
+					style="fill:#ffbf9d"
+				/><path
+					d="M356.93 201.48a23.19 23.19 0 0 1-3.51.42 22.36 22.36 0 0 1-3.51.38 8.47 8.47 0 0 1 3.45-.9 8.38 8.38 0 0 1 3.57.1Z"
+					style="fill:#ff9a6c"
+				/><path
+					d="M264 182.13c4 10.83 7.79 25.38 10.6 33.79 3.81 11.43 15.63 15.68 21.67 16.14 7.73.58 45.4-6.55 45.4-6.55l-1.74-19-4.27.11a5.72 5.72 0 0 0-3-1.44c-7.93-1.87-29.3-.31-29.3-.31s-5.75-23.11-7-34.46c-1-9-1-23.68-15.07-24.53-9.15.43-15.06 3.81-17.29 13.61"
+					style="fill:#5e9cff"
+				/><path
+					d="M264 159.53s0-.14.08-.4.16-.67.29-1.18a19.72 19.72 0 0 1 1.76-4.37 13.72 13.72 0 0 1 5.28-5.37 22.3 22.3 0 0 1 9.87-2.44l1.53.19a8.4 8.4 0 0 1 1.56.29l1.58.44 1.53.71a12.92 12.92 0 0 1 5 4.92 23.71 23.71 0 0 1 2.63 7.23 74 74 0 0 1 1.13 8.18 161.08 161.08 0 0 0 2.91 17.77c1.3 6.2 2.78 12.67 4.42 19.35l-.26-.18c5.12-.35 10.45-.59 15.92-.62 2.74 0 5.52 0 8.33.23a38.23 38.23 0 0 1 4.22.51 13.37 13.37 0 0 1 2.1.51 5.35 5.35 0 0 1 1.9 1.17l-.19-.07 4.27-.11h.24v.51c.59 6.41 1.17 12.7 1.72 18.7v.23h-.23c-7.65 1.43-15.09 2.73-22.26 3.88q-5.39.87-10.55 1.57c-3.45.47-6.82.88-10.14 1.06a22.36 22.36 0 0 1-9.5-1.65 28.77 28.77 0 0 1-7.87-4.54 23 23 0 0 1-5.39-6.5 36.76 36.76 0 0 1-2.74-7.26c-2.84-9.43-5-17-6.64-22.2-.82-2.6-1.49-4.59-1.95-5.94-.22-.66-.4-1.17-.52-1.53a5.06 5.06 0 0 1-.16-.52s.07.16.2.5.33.86.57 1.52c.49 1.34 1.19 3.32 2 5.91 1.72 5.16 3.91 12.75 6.79 22.16a36.86 36.86 0 0 0 2.75 7.18 22.52 22.52 0 0 0 5.32 6.37 28.72 28.72 0 0 0 7.76 4.45 22.15 22.15 0 0 0 9.33 1.59c3.29-.18 6.66-.6 10.1-1.07s6.95-1 10.53-1.59c7.16-1.16 14.6-2.46 22.24-3.89l-.21.27c-.55-6-1.13-12.28-1.72-18.69v-.26l.26.23-4.26.11h-.11l-.08-.08a6.64 6.64 0 0 0-3.74-1.54 36.32 36.32 0 0 0-4.16-.5c-2.78-.2-5.55-.24-8.28-.24-5.46 0-10.78.26-15.89.6h-.21l-.05-.21a536.51 536.51 0 0 1-4.39-19.37 156.74 156.74 0 0 1-2.88-17.83 74.73 74.73 0 0 0-1.1-8.14 23.43 23.43 0 0 0-2.55-7.13 12.64 12.64 0 0 0-4.89-4.8l-1.48-.7-1.54-.44a7.37 7.37 0 0 0-1.53-.29l-1.51-.2a22.13 22.13 0 0 0-9.77 2.35 13.6 13.6 0 0 0-5.25 5.24 20.45 20.45 0 0 0-1.82 4.31l-.33 1.17Z"
+					style="fill:#263238"
+				/><path
+					d="M298.27 216a19.44 19.44 0 0 0 5-11.61 5.13 5.13 0 0 1 .08 1.92 14.38 14.38 0 0 1-1.12 4.51 14.19 14.19 0 0 1-2.5 3.92 4.86 4.86 0 0 1-1.46 1.26ZM337 226a88.26 88.26 0 0 1-1.07-9.59 91.09 91.09 0 0 1-.54-9.64 87.31 87.31 0 0 1 1.06 9.6A89.66 89.66 0 0 1 337 226Z"
+					style="fill:#263238"
+				/></svg
+			>
+			<h3 class="text-2xl font-bold">{$_("done")}</h3>
+			<h4 class="text-xl font-semibold">
+				{cardCode}<br />{runnerinfo.firstname}
+				{runnerinfo.lastname} [#{runnerinfo.id}]
+			</h4>
+			<button
+				on:click={() => {
+					resetAll();
+				}}
+				type="button"
+				class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-100 text-blue-800 hover:bg-blue-200 focus:outline-hidden focus:bg-blue-200 disabled:opacity-50 disabled:pointer-events-none dark:text-blue-500 dark:bg-blue-800/30 dark:hover:bg-blue-800/20 dark:focus:bg-blue-800/20 mt-2"
+			>
+				{$_("next_runner")}
+			</button>
+		</div>
+	{:else if state === "assigning"}
+		<p class="text-center font-semibold">
+			{$_("please_wait_a_moment_while_we_assign_the_card")}<br />{cardCode}
+		</p>
+	{:else if state === "error_runner"}
+		<div class="text-center mx-auto">
+			<svg
+				class="h-64 mx-auto"
+				xmlns="http://www.w3.org/2000/svg"
+				viewBox="0 0 500 500"
+				><path
+					d="M298.37 335.5C382 299.85 469.46 233.1 432.31 135 398.6 46 284.74 25.75 219.62 102.47c-28.09 33.09-23.18 77.05-57.16 106.51s-90.4 45.83-75.13 104c23.67 89.93 156 46.02 211.04 22.52Z"
+					style="fill:#407bff"
+				/><path
+					d="M298.37 335.5C382 299.85 469.46 233.1 432.31 135 398.6 46 284.74 25.75 219.62 102.47c-28.09 33.09-23.18 77.05-57.16 106.51s-90.4 45.83-75.13 104c23.67 89.93 156 46.02 211.04 22.52Z"
+					style="fill:#fff;opacity:.9"
+				/><path
+					d="M360.6 263.05h-.36c-26.64-2.18-45-25-45.74-25.92a4.47 4.47 0 0 1 7-5.55c.21.27 15.9 19.61 37.63 22.37 7-7 13-25.48 12.33-31.07v-.16c-.14-1.8-.48-8 1.29-11.65a4.47 4.47 0 0 1 8 3.88c-.44.92-.65 4.23-.44 7 1 9.2-7 32.42-17 40.19a4.47 4.47 0 0 1-2.71.91ZM148.82 238.82a65.8 65.8 0 0 1-48.56-22.28 4.46 4.46 0 0 1-.26-5.64c7.22-9.71 20-32.64 22-40.11a10.91 10.91 0 0 0-4.14-4.33 4.45 4.45 0 0 1-2.55-3.61l-.72-7.32a4.47 4.47 0 0 1 8.89-.88l.5 5.09a22.34 22.34 0 0 1 6.81 8.65 4.48 4.48 0 0 1 .32 2.26c-.92 7.93-13.79 30.9-21.71 42.51 18.49 18.43 40.59 16.75 41.56 16.66a4.47 4.47 0 0 1 .82 8.9c-.26.02-1.29.1-2.96.1ZM292.87 416.09h-12a4.47 4.47 0 0 1-4.31-5.66c3.13-11.24 4.67-20.39 5.82-34.71-4.24-20-8.23-38.21-8.27-38.39a4.47 4.47 0 0 1 8.73-1.91c0 .18 4.12 18.86 8.41 39.08a4.23 4.23 0 0 1 .08 1.28c-1 12.86-2.31 21.75-4.67 31.38h6.18a4.47 4.47 0 0 1 0 8.93ZM200.32 416.09h-6.76a4.45 4.45 0 0 1-4.42-5.08c1.15-8.2 7-23.13 13.3-38.14 2.23-19.8 4.05-36.8 4.07-37a4.47 4.47 0 1 1 8.88 1c0 .17-1.88 17.56-4.15 37.65a4.31 4.31 0 0 1-.32 1.22c-4.43 10.63-9.49 23.15-11.8 31.44h1.2a4.47 4.47 0 1 1 0 8.93Z"
+					style="fill:#263238"
+				/><path
+					d="m204.21 111-52.06 52.07c-2.62 57.71-2.41 118.33 0 181.18h172.16c-3.41-81.1-3.73-159.17 0-233.25Z"
+					style="fill:#fff"
+				/><path
+					d="M324.31 345.13H152.15a.9.9 0 0 1-.9-.86c-2.49-65.27-2.49-126.27 0-181.27a.9.9 0 0 1 .27-.59l52.06-52.07a.89.89 0 0 1 .63-.26h120.1a.9.9 0 0 1 .65.28.87.87 0 0 1 .24.66c-3.59 71.34-3.59 147.61 0 233.17a.89.89 0 0 1-.25.65.86.86 0 0 1-.64.29ZM153 343.34h170.38c-3.54-84.86-3.55-160.59 0-231.47h-118.8L153 163.43c-2.45 54.64-2.45 115.16 0 179.91Z"
+					style="fill:#263238"
+				/><path
+					d="M214.28 219.19c-.2-4.36-2.67-7.8-5.53-7.7s-5 3.71-4.82 8.07 2.67 7.8 5.53 7.69 5.02-3.71 4.82-8.06ZM274.65 217.82c-.2-4.35-2.67-7.79-5.53-7.69s-5 3.71-4.82 8.07 2.68 7.8 5.53 7.69 5.02-3.71 4.82-8.07ZM229.35 237a36.55 36.55 0 0 1 28.63 1.3 1.27 1.27 0 0 1 .49 1.74 1.3 1.3 0 0 1-1.75.49c-.15-.08-14.4-7.76-31.41 1a1.31 1.31 0 0 1-1.74-.54 1.27 1.27 0 0 1 .55-1.72 41.73 41.73 0 0 1 5.23-2.27ZM205.64 178.34a2.64 2.64 0 0 1 1.26.36 2.58 2.58 0 0 1 .92 3.51A25.29 25.29 0 0 1 188.27 195a2.59 2.59 0 0 1-2.69-2.45 2.55 2.55 0 0 1 2.44-2.66c.39 0 9.62-.58 15.36-10.27a2.52 2.52 0 0 1 2.26-1.28ZM266.05 176.87a2.57 2.57 0 0 1 2.33.72c8 8 17.14 6.39 17.52 6.32a2.6 2.6 0 0 1 3 2 2.54 2.54 0 0 1-2 3c-.5.09-12.14 2.31-22.21-7.75a2.54 2.54 0 0 1 1.31-4.3Z"
+					style="fill:#407bff"
+				/><path
+					d="m321.72 204.86-7.31.68a5.22 5.22 0 0 1-5.58-4.06L298.7 156.1a5.22 5.22 0 0 1 3.77-6.18l19.59-5.14ZM209 167.69c-5.09-13.89-10.18-36.12-4.81-56.71l-52.06 52.07c14.73 4.95 38.19 7.06 56.87 4.64Z"
+					style="opacity:.2"
+				/><path
+					d="M204.21 163.05c-5.71-16.86-3.38-39.78 0-52.07l-52.06 52.07c15.76 2.87 33.37 2.41 52.06 0Z"
+					style="fill:#fff"
+				/><path
+					d="M176 165.92a133.14 133.14 0 0 1-24-2 .88.88 0 0 1-.47-1.5l52.06-52.07a.89.89 0 0 1 1.49.87c-3.14 11.44-5.75 34.6 0 51.54a.93.93 0 0 1-.09.76.87.87 0 0 1-.64.41 221.85 221.85 0 0 1-28.35 1.99Zm-22-3.46c13.84 2.29 29.91 2.24 49-.16-4.71-14.94-3.64-34.71-.48-48.4Z"
+					style="fill:#263238"
+				/></svg
+			>
+			<p class="text-lg font-semibold">{$_("runner_not_found")}</p>
+			<button
+				on:click={() => {
+					resetAll();
+				}}
+				type="button"
+				class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-100 text-blue-800 hover:bg-blue-200 focus:outline-hidden focus:bg-blue-200 disabled:opacity-50 disabled:pointer-events-none dark:text-blue-500 dark:bg-blue-800/30 dark:hover:bg-blue-800/20 dark:focus:bg-blue-800/20 mt-2"
+			>
+				{$_("try_again")}
+			</button>
+		</div>
+	{:else if state === "error_card"}
+		<div class="text-center mx-auto">
+			<svg
+				class="h-64 mx-auto"
+				xmlns="http://www.w3.org/2000/svg"
+				viewBox="0 0 500 500"
+				><path
+					d="M298.37 335.5C382 299.85 469.46 233.1 432.31 135 398.6 46 284.74 25.75 219.62 102.47c-28.09 33.09-23.18 77.05-57.16 106.51s-90.4 45.83-75.13 104c23.67 89.93 156 46.02 211.04 22.52Z"
+					style="fill:#407bff"
+				/><path
+					d="M298.37 335.5C382 299.85 469.46 233.1 432.31 135 398.6 46 284.74 25.75 219.62 102.47c-28.09 33.09-23.18 77.05-57.16 106.51s-90.4 45.83-75.13 104c23.67 89.93 156 46.02 211.04 22.52Z"
+					style="fill:#fff;opacity:.9"
+				/><path
+					d="M360.6 263.05h-.36c-26.64-2.18-45-25-45.74-25.92a4.47 4.47 0 0 1 7-5.55c.21.27 15.9 19.61 37.63 22.37 7-7 13-25.48 12.33-31.07v-.16c-.14-1.8-.48-8 1.29-11.65a4.47 4.47 0 0 1 8 3.88c-.44.92-.65 4.23-.44 7 1 9.2-7 32.42-17 40.19a4.47 4.47 0 0 1-2.71.91ZM148.82 238.82a65.8 65.8 0 0 1-48.56-22.28 4.46 4.46 0 0 1-.26-5.64c7.22-9.71 20-32.64 22-40.11a10.91 10.91 0 0 0-4.14-4.33 4.45 4.45 0 0 1-2.55-3.61l-.72-7.32a4.47 4.47 0 0 1 8.89-.88l.5 5.09a22.34 22.34 0 0 1 6.81 8.65 4.48 4.48 0 0 1 .32 2.26c-.92 7.93-13.79 30.9-21.71 42.51 18.49 18.43 40.59 16.75 41.56 16.66a4.47 4.47 0 0 1 .82 8.9c-.26.02-1.29.1-2.96.1ZM292.87 416.09h-12a4.47 4.47 0 0 1-4.31-5.66c3.13-11.24 4.67-20.39 5.82-34.71-4.24-20-8.23-38.21-8.27-38.39a4.47 4.47 0 0 1 8.73-1.91c0 .18 4.12 18.86 8.41 39.08a4.23 4.23 0 0 1 .08 1.28c-1 12.86-2.31 21.75-4.67 31.38h6.18a4.47 4.47 0 0 1 0 8.93ZM200.32 416.09h-6.76a4.45 4.45 0 0 1-4.42-5.08c1.15-8.2 7-23.13 13.3-38.14 2.23-19.8 4.05-36.8 4.07-37a4.47 4.47 0 1 1 8.88 1c0 .17-1.88 17.56-4.15 37.65a4.31 4.31 0 0 1-.32 1.22c-4.43 10.63-9.49 23.15-11.8 31.44h1.2a4.47 4.47 0 1 1 0 8.93Z"
+					style="fill:#263238"
+				/><path
+					d="m204.21 111-52.06 52.07c-2.62 57.71-2.41 118.33 0 181.18h172.16c-3.41-81.1-3.73-159.17 0-233.25Z"
+					style="fill:#fff"
+				/><path
+					d="M324.31 345.13H152.15a.9.9 0 0 1-.9-.86c-2.49-65.27-2.49-126.27 0-181.27a.9.9 0 0 1 .27-.59l52.06-52.07a.89.89 0 0 1 .63-.26h120.1a.9.9 0 0 1 .65.28.87.87 0 0 1 .24.66c-3.59 71.34-3.59 147.61 0 233.17a.89.89 0 0 1-.25.65.86.86 0 0 1-.64.29ZM153 343.34h170.38c-3.54-84.86-3.55-160.59 0-231.47h-118.8L153 163.43c-2.45 54.64-2.45 115.16 0 179.91Z"
+					style="fill:#263238"
+				/><path
+					d="M214.28 219.19c-.2-4.36-2.67-7.8-5.53-7.7s-5 3.71-4.82 8.07 2.67 7.8 5.53 7.69 5.02-3.71 4.82-8.06ZM274.65 217.82c-.2-4.35-2.67-7.79-5.53-7.69s-5 3.71-4.82 8.07 2.68 7.8 5.53 7.69 5.02-3.71 4.82-8.07ZM229.35 237a36.55 36.55 0 0 1 28.63 1.3 1.27 1.27 0 0 1 .49 1.74 1.3 1.3 0 0 1-1.75.49c-.15-.08-14.4-7.76-31.41 1a1.31 1.31 0 0 1-1.74-.54 1.27 1.27 0 0 1 .55-1.72 41.73 41.73 0 0 1 5.23-2.27ZM205.64 178.34a2.64 2.64 0 0 1 1.26.36 2.58 2.58 0 0 1 .92 3.51A25.29 25.29 0 0 1 188.27 195a2.59 2.59 0 0 1-2.69-2.45 2.55 2.55 0 0 1 2.44-2.66c.39 0 9.62-.58 15.36-10.27a2.52 2.52 0 0 1 2.26-1.28ZM266.05 176.87a2.57 2.57 0 0 1 2.33.72c8 8 17.14 6.39 17.52 6.32a2.6 2.6 0 0 1 3 2 2.54 2.54 0 0 1-2 3c-.5.09-12.14 2.31-22.21-7.75a2.54 2.54 0 0 1 1.31-4.3Z"
+					style="fill:#407bff"
+				/><path
+					d="m321.72 204.86-7.31.68a5.22 5.22 0 0 1-5.58-4.06L298.7 156.1a5.22 5.22 0 0 1 3.77-6.18l19.59-5.14ZM209 167.69c-5.09-13.89-10.18-36.12-4.81-56.71l-52.06 52.07c14.73 4.95 38.19 7.06 56.87 4.64Z"
+					style="opacity:.2"
+				/><path
+					d="M204.21 163.05c-5.71-16.86-3.38-39.78 0-52.07l-52.06 52.07c15.76 2.87 33.37 2.41 52.06 0Z"
+					style="fill:#fff"
+				/><path
+					d="M176 165.92a133.14 133.14 0 0 1-24-2 .88.88 0 0 1-.47-1.5l52.06-52.07a.89.89 0 0 1 1.49.87c-3.14 11.44-5.75 34.6 0 51.54a.93.93 0 0 1-.09.76.87.87 0 0 1-.64.41 221.85 221.85 0 0 1-28.35 1.99Zm-22-3.46c13.84 2.29 29.91 2.24 49-.16-4.71-14.94-3.64-34.71-.48-48.4Z"
+					style="fill:#263238"
+				/></svg
+			>
+			<p class="text-lg font-semibold">{$_("card_not_found")}</p>
+			<button
+				on:click={() => {
+					state = "scan_card";
+					scannerActive = true;
+				}}
+				type="button"
+				class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-100 text-blue-800 hover:bg-blue-200 focus:outline-hidden focus:bg-blue-200 disabled:opacity-50 disabled:pointer-events-none dark:text-blue-500 dark:bg-blue-800/30 dark:hover:bg-blue-800/20 dark:focus:bg-blue-800/20 mt-2"
+			>
+				{$_("try_again")}
+			</button>
+		</div>
 	{:else}
 		<!--  -->
-		{#if state === "scan_runner"}
-			<h3 class="text-xl font-bold">Scan Runner (Selfservice QR)</h3>
+		{#if runnerinfo.id === 0}
+			<h3 class="text-2xl font-bold">{$_("scan_runner")}</h3>
+			<h4 class="text-xl font-semibold">
+				{$_("selfservice_qr_registration_barcode")}
+			</h4>
+		{:else}
+			<h3 class="text-2xl font-bold">
+				{runnerinfo.firstname}
+				{runnerinfo.lastname}
+			</h3>
+			<p>
+				ID: #{runnerinfo.id}<br />created_via: {runnerinfo.created_via}<br
+				/>{runnerinfo.group.name}
+			</p>
 		{/if}
-		{#if state === "scan_card"}
-			<h3 class="text-xl font-bold">Runner Scanned</h3>
-			<p>{runnerID}</p>
-			<h3 class="text-xl font-bold">Scan Card (Code 128 Barcode)</h3>
+		<!--  -->
+	{/if}
+	{#if state === "scan_card"}
+		<h3 class="text-2xl font-bold">{$_("scan_card")}</h3>
+		<h4 class="text-xl font-semibold">{$_("code_128_barcode")}</h4>
+	{/if}
+	{#if state.includes("scan_")}
+		{#if scannerActive}
+			<QrCodeScanner
+				:paused={!scannerActive}
+				on:detect={(e) => {
+					if (scannerActive) {
+						scannerActive = false;
+						console.log({ type: "DETECT", code: e.detail.decodedText });
+						if (runnerinfo.id === 0) {
+							new Audio("/beep.mp3").play();
+							if (
+								e.detail.decodedText.includes(
+									"https://portal.lauf-fuer-kaya.de/profile/"
+								)
+							) {
+								const runnerID = JSON.parse(
+									atob(
+										e.detail.decodedText
+											.replace("https://portal.lauf-fuer-kaya.de/profile/", "")
+											.split(".")[1]
+									)
+								).id;
+								RunnerService.runnerControllerGetOne(runnerID)
+									.then((runner) => {
+										runnerinfo = runner;
+									})
+									.catch((e) => {
+										console.error(e);
+										state = "error_runner";
+										// resetAll();
+									});
+							} else {
+								const runnerID = parseInt(e.detail.decodedText);
+								RunnerService.runnerControllerGetOne(runnerID)
+									.then((runner) => {
+										runnerinfo = runner;
+									})
+									.catch((e) => {
+										console.error(e);
+										state = "error_runner";
+										// resetAll();
+									});
+							}
+						} else {
+							if (`${e.detail.decodedText}`.length > 10) {
+								cardCode = e.detail.decodedText;
+								new Audio("/beep.mp3").play();
+								state = "assigning";
+								RunnerCardService.runnerCardControllerGetAll()
+									.then((cards) => {
+										// console.log(cards);
+										const card = cards.find((c) => c.code === cardCode);
+										if (card) {
+											console.log("card found", card);
+											RunnerCardService.runnerCardControllerPut(card.id, {
+												enabled: true,
+												id: card.id,
+												runner: runnerinfo.id,
+											})
+												.then(() => {
+													state = "done";
+												})
+												.catch(() => {
+													state = "error_card";
+													scannerActive = false;
+												});
+										} else {
+											console.log("card not found");
+											// scannerActive = true;
+											state = "error_card";
+											scannerActive = false;
+										}
+									})
+									.catch(() => {
+										scannerActive = true;
+									});
+							}
+						}
+					}
+				}}
+				width={320}
+				height={320}
+				class="w-full max-w-sm bg-neutral-300 rounded-lg overflow-hidden"
+			/>
 		{/if}
-		<QrCodeScanner
-			on:detect={(e) => {
-				console.log({ type: "DETECT", code: e.detail.decodedText });
-				if (state === "scan_runner") {
-					if (
-						e.detail.decodedText.includes(
-							"https://portal.lauf-fuer-kaya.de/profile/"
-						)
-					) {
-						runnerID = JSON.parse(
-							atob(
-								e.detail.decodedText
-									.replace("https://portal.lauf-fuer-kaya.de/profile/", "")
-									.split(".")[1]
-							)
-						).id;
-						state = "scan_card";
-					}
-				}
-				if (state === "scan_card") {
-					if (
-						!e.detail.decodedText.includes(
-							"https://portal.lauf-fuer-kaya.de/profile/"
-						)
-					) {
-						cardInfo = e.detail.decodedText;
-						state = "done";
-					}
-				}
-			}}
-			width={320}
-			height={320}
-			class="w-full max-w-sm bg-neutral-300 rounded-lg overflow-hidden"
-		/>
-		{#if state === "scan_card"}
+		{#if runnerinfo.id !== 0 && state !== "scan_card"}
+			<button
+				on:click={() => {
+					state = "scan_card";
+					scannerActive = true;
+				}}
+				type="button"
+				class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-100 text-blue-800 hover:bg-blue-200 focus:outline-hidden focus:bg-blue-200 disabled:opacity-50 disabled:pointer-events-none dark:text-blue-500 dark:bg-blue-800/30 dark:hover:bg-blue-800/20 dark:focus:bg-blue-800/20 w-full mt-2"
+			>
+				{$_("scan_card")}
+			</button>
+		{/if}
+		{#if state === "scan_card" || runnerinfo.id !== 0}
 			<button
 				on:click={() => {
 					state = "scan_runner";
-					runnerID = undefined;
-					cardInfo = "";
+					scannerActive = true;
+					runnerinfo = { id: 0, firstname: "", lastname: "" };
+					cardCode = "";
 				}}
 				type="button"
 				class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-red-100 text-red-800 hover:bg-red-200 focus:outline-hidden focus:bg-red-200 disabled:opacity-50 disabled:pointer-events-none dark:text-red-500 dark:bg-red-800/30 dark:hover:bg-red-800/20 dark:focus:bg-red-800/20 w-full mt-2"
 			>
-				Cancel
+				{$_("cancel")}
 			</button>
 		{/if}
 		<!--  -->
--- a/src/components/general/Footer.svelte
+++ b/src/components/general/Footer.svelte
@@ -1,51 +1,55 @@
 <script>
-  import { onMount } from "svelte";
-  import { _ } from "svelte-i18n";
-  $: releaseinfo = "";
-  onMount(() => {
-    releaseinfo = document
-      .getElementById("buildinfo")
-      .textContent.replace("RELEASE_INFO-", "")
-      .replace("-RELEASE_INFO", "");
-  });
-  const year = new Date().getFullYear();
+	import { onMount } from "svelte";
+	import { _ } from "svelte-i18n";
+	$: releaseinfo = "";
+	onMount(() => {
+		releaseinfo = document
+			.getElementById("buildinfo")
+			.textContent.replace("RELEASE_INFO-", "")
+			.replace("-RELEASE_INFO", "");
+	});
+	const year = new Date().getFullYear();
 </script>

 <footer class="p-5 w-full">
-  <p class="text-sm text-gray-500 mt-4">
-    Lauf für Kaya! Läufersystem - Copyright ©
-    {year}
-    + proudly powered by
-    <a
-      class="underline"
-      href="https://odit.services"
-      rel="noopener,noreferrer"
-      target="_blank">ODIT.Services</a
-    >
-  </p>
-  <p class="text-sm text-gray-500 mt-4">
-    <a
-      class="underline"
-      target="_blank"
-      rel="noopener, noreferrer"
-      href="https://git.odit.services/lfk/frontend/">LfK!Frontend</a
-    >@<a
-      class="underline"
-      target="_blank"
-      rel="noopener, noreferrer"
-      href="https://git.odit.services/lfk/frontend/src/tag/{releaseinfo}"
-      >{releaseinfo}</a
-    >
-    -
-    <a
-      rel="noopener, noreferrer"
-      class="underline"
-      href="https://docs.lauf-fuer-kaya.de"
-      target="_blank">{$_("documentation")}</a
-    >
-    -
-    <a class="underline" href="/privacy">{$_("privacy")}</a>
-    -
-    <a class="underline" href="/imprint">{$_("imprint")}</a>
-  </p>
+	<p class="text-sm text-gray-500 mt-4">
+		Lauf für Kaya! Läufersystem - Copyright ©
+		{year}
+		+ proudly powered by
+		<a
+			class="underline"
+			href="https://odit.services"
+			rel="noopener,noreferrer"
+			target="_blank">ODIT.Services</a
+		>
+	</p>
+	<p class="text-sm text-gray-500 mt-4">
+		<a
+			class="underline"
+			target="_blank"
+			rel="noopener, noreferrer"
+			href="https://git.odit.services/lfk/frontend/">LfK!Frontend</a
+		>@<a
+			class="underline"
+			target="_blank"
+			rel="noopener, noreferrer"
+			href="https://git.odit.services/lfk/frontend/src/tag/{releaseinfo}"
+			>{releaseinfo}</a
+		>
+		-
+		<a
+			rel="noopener, noreferrer"
+			class="underline"
+			href="https://docs.lauf-fuer-kaya.de"
+			target="_blank">{$_("documentation")}</a
+		>
+		-
+		<a class="underline" href="https://lauf-fuer-kaya.de/datenschutz/"
+			>{$_("privacy")}</a
+		>
+		-
+		<a class="underline" href="https://lauf-fuer-kaya.de/impressum/"
+			>{$_("imprint")}</a
+		>
+	</p>
 </footer>
--- a/src/components/general/Imprint.svelte
+++ b/src/components/general/Imprint.svelte
@@ -1,52 +0,0 @@
-<script>
-  import { _, getLocaleFromNavigator } from "svelte-i18n";
-  import { parse } from "marked";
-  import Footer from "./Footer.svelte";
-  // import * as css from "../base/simple.css";
-  let html = "";
-  async function load() {
-    let md = await fetch("/imprint_" + getLocaleFromNavigator() + ".md");
-    let text = (await md.text()).toString();
-    if (text.includes("<meta")) {
-      md.ok = false;
-    }
-    if (!md.ok) {
-      md = await fetch("/imprint_en.md");
-      text = await md.text();
-    }
-    html = parse(text);
-  }
-  const promise = load();
-</script>
-
-<div class="pt-12 px-4 sm:px-6 lg:px-8 lg:pt-20 bg-gray-900 pb-12">
-  <div class="text-center mb-8">
-    <h1
-      class="mt-9 font-display text-4xl leading-none font-semibold text-white sm:text-5xl lg:text-6xl"
-    >
-      {$_("imprint")}
-    </h1>
-  </div>
-</div>
-
-<div class="pt-0 pb-16 overflow-hidden lg:pt-12 lg:py-24">
-  <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
-    {#await promise}
-      <p class="text-center w-full">{$_("imprint-loading")}</p>
-    {:then}
-      <div class="simplecontent">
-        {@html html}
-      </div>
-    {:catch error}
-      <div
-        class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
-      >
-        <span class="inline-block align-middle mr-8">
-          <b class="capitalize">{$_("general_promise_error")}</b>
-          {error}
-        </span>
-      </div>
-    {/await}
-  </div>
-</div>
-<Footer />
--- a/src/components/general/Privacy.svelte
+++ b/src/components/general/Privacy.svelte
@@ -1,52 +0,0 @@
-<script>
-  import { _, getLocaleFromNavigator } from "svelte-i18n";
-  import { parse } from "marked";
-  import Footer from "./Footer.svelte";
-  // import * as css from "../base/simple.css?inline";
-  let html = "";
-  async function load() {
-    let md = await fetch("/privacy_" + getLocaleFromNavigator() + ".md");
-    let text = (await md.text()).toString();
-    if (text.includes("<meta")) {
-      md.ok = false;
-    }
-    if (!md.ok) {
-      md = await fetch("/privacy_en.md");
-      text = await md.text();
-    }
-    html = parse(text);
-  }
-  const promise = load();
-</script>
-
-<div class="pt-12 px-4 sm:px-6 lg:px-8 lg:pt-20 bg-gray-900 pb-12">
-  <div class="text-center mb-8">
-    <h1
-      class="mt-9 font-display text-4xl leading-none font-semibold text-white sm:text-5xl lg:text-6xl"
-    >
-      {$_("privacy")}
-    </h1>
-  </div>
-</div>
-
-<div class="pt-0 pb-16 overflow-hidden lg:pt-12 lg:py-24">
-  <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
-    {#await promise}
-      <p class="text-center w-full">{$_("privacy-loading")}</p>
-    {:then}
-      <div class="simplecontent">
-        {@html html}
-      </div>
-    {:catch error}
-      <div
-        class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
-      >
-        <span class="inline-block align-middle mr-8">
-          <b class="capitalize">{$_("general_promise_error")}</b>
-          {error}
-        </span>
-      </div>
-    {/await}
-  </div>
-</div>
-<Footer />
--- a/src/components/general/QrCodeScanner.svelte
+++ b/src/components/general/QrCodeScanner.svelte
@@ -4,8 +4,8 @@
 		Html5QrcodeScanner,
 		Html5QrcodeScanType,
 		Html5QrcodeSupportedFormats,
-		Html5QrcodeScannerState,
 	} from "html5-qrcode";
+	import { debounce } from "underscore";

 	export let width;
 	export let height;
@@ -13,13 +13,27 @@

 	const dispatch = createEventDispatcher();

+	const debouncedDispatch = debounce(
+		function (decodedText) {
+			// console.log("dispatchEvent");
+			dispatch("detect", { decodedText });
+		},
+		500,
+		true
+	);
+
 	function onScanSuccess(decodedText, decodedResult) {
-		dispatch("detect", { decodedText });
+		// console.log("onScanSuccess", decodedText);
+		if (!paused) {
+			debouncedDispatch(decodedText);
+		}
 	}

 	// usually better to ignore and keep scanning
 	function onScanFailure(message) {
-		dispatch("error", { message });
+		if (!paused) {
+			dispatch("error", { message });
+		}
 	}

 	let scanner;
@@ -28,6 +42,7 @@
 			"qr-scanner",
 			{
 				fps: 10,
+				showTorchButtonIfSupported: true,
 				rememberLastUsedCamera: true,
 				qrbox: { width, height },
 				aspectRatio: 1,
@@ -44,16 +59,6 @@
 		);
 		scanner.render(onScanSuccess, onScanFailure);
 	});
-
-	// pause/resume scanner to avoid unintended scans
-	$: togglePause(paused);
-	function togglePause(paused) {
-		if (paused && scanner?.getState() === Html5QrcodeScannerState.SCANNING) {
-			scanner?.pause();
-		} else if (scanner?.getState() === Html5QrcodeScannerState.PAUSED) {
-			scanner?.resume();
-		}
-	}
 </script>

 <div id="qr-scanner" class={$$props.class} />
--- a/src/components/groups/AddGroupModal.svelte
+++ b/src/components/groups/AddGroupModal.svelte
@@ -79,7 +79,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/groups/UserGroupsOverview.svelte
+++ b/src/components/groups/UserGroupsOverview.svelte
@@ -140,7 +140,7 @@
  {:catch error}
    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
      <span class="inline-block align-middle mr-8">
-        <b class="capitalize">{$_("general_promise_error")}</b>
+        <b>{$_("general_promise_error")}</b>
        {error}
      </span>
    </div>
--- a/src/components/orgs/AddOrgModal.svelte
+++ b/src/components/orgs/AddOrgModal.svelte
@@ -102,7 +102,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/orgs/ConfirmOrgDeletionModal.svelte
+++ b/src/components/orgs/ConfirmOrgDeletionModal.svelte
@@ -45,7 +45,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
--- a/src/components/orgs/OrgDetail.svelte
+++ b/src/components/orgs/OrgDetail.svelte
@@ -224,7 +224,7 @@
 				>{$_("contact")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					label.toLowerCase().includes(filterText.toLowerCase()) ||
 					option.value.id.toString().startsWith(filterText.toLowerCase())}
--- a/src/components/orgs/Orgs.svelte
+++ b/src/components/orgs/Orgs.svelte
@@ -230,7 +230,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b class="capitalize">{$_("general_promise_error")}</b>
+					<b>{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>
--- a/src/components/pdf_generation/DocumentServer.ts
+++ b/src/components/pdf_generation/DocumentServer.ts
@@ -100,6 +100,7 @@ class DocumentServer {
        first_name: runners[i].firstname,
        middle_name: runners[i].middlename,
        last_name: runners[i].lastname,
+        self_service_link: runners[i].selfserviceLink,
        group: {
          id: runners[i].group.id,
          name: runners[i].group.name,
--- a/src/components/pdf_generation/DownloadProgressModal.svelte
+++ b/src/components/pdf_generation/DownloadProgressModal.svelte
@@ -42,7 +42,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
--- a/src/components/pdf_generation/GenerateRunnerCertificates.svelte
+++ b/src/components/pdf_generation/GenerateRunnerCertificates.svelte
@@ -1,175 +1,180 @@
 <script>
-	import { _ } from "svelte-i18n";
-	import {
-		DonationService,
-		RunnerTeamService,
-		RunnerOrganizationService,
-	} from "@odit/lfk-client-js";
-	import { init } from "@paralleldrive/cuid2";
-	import toast from "svelte-french-toast";
-	import DocumentServer from "./DocumentServer";
-	const createId = init({ length: 10, fingerprint: "lfk-frontend" });
-	const documentServer = new DocumentServer(
-		config.baseurl_documentserver,
-		config.documentserver_key
-	);
+  import { _ } from "svelte-i18n";
+  import {
+    DonationService,
+    RunnerTeamService,
+    RunnerOrganizationService,
+	RunnerService
+  } from "@odit/lfk-client-js";
+  import { init } from "@paralleldrive/cuid2";
+  import toast from "svelte-french-toast";
+  import DocumentServer from "./DocumentServer";
+  const createId = init({ length: 10, fingerprint: "lfk-frontend" });
+  const documentServer = new DocumentServer(
+    config.baseurl_documentserver,
+    config.documentserver_key
+  );

-	export let certificates_show = false;
-	export let generate_runners = [];
-	export let generate_orgs = [];
-	export let generate_teams = [];
+  export let certificates_show = false;
+  export let generate_runners = [];
+  export let generate_orgs = [];
+  export let generate_teams = [];

-	function generateCertificates(locale) {
-		if (generate_orgs.length > 0) {
-			generateOrgCertificates(locale);
-		} else if (generate_teams.length > 0) {
-			generateTeamCertificates(locale);
-		} else {
-			generateRunnerCertificates(locale);
-		}
-	}
-	function download(blob, fileName) {
-		const url = window.URL.createObjectURL(blob);
-		let a = document.createElement("a");
-		a.href = url;
-		a.download = fileName;
-		document.body.appendChild(a);
-		a.click();
-		a.remove();
-		toast.dismiss();
-		toast.success($_("pdf-successfully-generated"));
-	}
+  function generateCertificates(locale) {
+    if (generate_orgs.length > 0) {
+      generateOrgCertificates(locale);
+    } else if (generate_teams.length > 0) {
+      generateTeamCertificates(locale);
+    } else {
+      generateRunnerCertificates(locale);
+    }
+  }
+  function download(blob, fileName) {
+    const url = window.URL.createObjectURL(blob);
+    let a = document.createElement("a");
+    a.href = url;
+    a.download = fileName;
+    document.body.appendChild(a);
+    a.click();
+    a.remove();
+    toast.dismiss();
+    toast.success($_("pdf-successfully-generated"));
+  }

-	async function generateRunnerCertificates(locale) {
-		toast.loading($_("generating-pdf"));
-		const current_donations =
-			(await DonationService.donationControllerGetAll()) || [];
-		let certificateRunners = [];
-		for (let runner of generate_runners) {
-			runner.distanceDonations =
-				current_donations.filter((d) => d.runner?.id == runner.id) || [];
-			certificateRunners.push(runner);
-		}
-		documentServer
-			.generateCertificates(certificateRunners, locale)
-			.then((blob) => {
-				let fileName = `${$_("certificates")}-${locale}.pdf`;
-				if (generate_runners.length == 1) {
-					fileName = `${$_("certificates")}_${
-						generate_runners[0].firstname
-					}_${generate_runners[0].lastname}-${locale}-${createId()}.pdf`;
-				}
-				download(blob, fileName);
-			})
-			.catch((err) => {});
-	}
+  async function generateRunnerCertificates(locale) {
+    toast.loading($_("generating-pdf"));
+    const current_donations =
+      (await DonationService.donationControllerGetAll()) || [];
+    let certificateRunners = [];
+    for (let runner of generate_runners) {
+	  const linkRunner = await RunnerService.runnerControllerGetOne(runner.id)
+      linkRunner.distanceDonations =
+        current_donations.filter((d) => d.runner?.id == runner.id) || [];
+      certificateRunners.push(linkRunner);
+    }
+    documentServer
+      .generateCertificates(certificateRunners, locale)
+      .then((blob) => {
+        let fileName = `${$_("certificates")}-${locale}.pdf`;
+        if (generate_runners.length == 1) {
+          fileName = `${$_("certificates")}_${
+            generate_runners[0].firstname
+          }_${generate_runners[0].lastname}-${locale}-${createId()}.pdf`;
+        }
+        download(blob, fileName);
+      })
+      .catch((err) => {});
+  }

-	async function generateTeamCertificates(locale) {
-		toast.loading($_("generating-pdfs"));
-		let count = 0;
-		const current_donations =
-			(await DonationService.donationControllerGetAll()) || [];
-		for (const t of generate_teams) {
-			const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
-				t.id
-			);
-			let certificateRunners = [];
-			for (let runner of runners) {
-				runner.distanceDonations =
-					current_donations.filter((d) => d.runner?.id == runner.id) || [];
-				certificateRunners.push(runner);
-			}
-			documentServer
-				.generateCertificates(certificateRunners, locale)
-				.then((blob) => {
-					count++;
-					download(
-						blob,
-						`${$_("certificates")}_${t.name}-${locale}-${createId()}.pdf`
-					);
-				})
-				.catch((err) => {});
-		}
-	}
+  async function generateTeamCertificates(locale) {
+    toast.loading($_("generating-pdfs"));
+    let count = 0;
+    const current_donations =
+      (await DonationService.donationControllerGetAll()) || [];
+    for (const t of generate_teams) {
+      const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+        t.id,
+        true
+      );
+      let certificateRunners = [];
+      for (let runner of runners) {
+        runner.distanceDonations =
+          current_donations.filter((d) => d.runner?.id == runner.id) || [];
+        certificateRunners.push(runner);
+      }
+      documentServer
+        .generateCertificates(certificateRunners, locale)
+        .then((blob) => {
+          count++;
+          download(
+            blob,
+            `${$_("certificates")}_${t.name}-${locale}-${createId()}.pdf`
+          );
+        })
+        .catch((err) => {});
+    }
+  }

-	async function generateOrgCertificates(locale) {
-		toast.loading($_("generating-pdfs"));
-		const current_donations =
-			(await DonationService.donationControllerGetAll()) || [];
-		let count = 0;
-		let count_orgs = 0;
-		for (const o of generate_orgs) {
-			count_orgs++;
-			let count = 0;
-			let runners =
-				await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
-					o.id,
-					true
-				);
-			let certificateRunners = [];
-			for (let runner of runners) {
-				runner.distanceDonations =
-					current_donations.filter((d) => d.runner?.id == runner.id) || [];
-				certificateRunners.push(runner);
-			}
-			await documentServer
-				.generateCertificates(certificateRunners, locale)
-				.then((blob) => {
-					download(
-						blob,
-						`${$_("certificates")}_${o.name}-${locale}-${createId()}.pdf`
-					);
-				})
-				.catch((err) => {});
-			for (const t of o.teams) {
-				count++;
-				let runners = await RunnerTeamService.runnerTeamControllerGetRunners(
-					t.id
-				);
-				let certificateRunners = [];
-				for (let runner of runners) {
-					runner.distanceDonations =
-						current_donations.filter((d) => d.runner?.id == runner.id) || [];
-					certificateRunners.push(runner);
-				}
-				await documentServer
-					.generateCertificates(certificateRunners, locale)
-					.then((blob) => {
-						download(
-							blob,
-							`${$_("certificates")}_${o.name}_${
-								t.name
-							}-${locale}-${createId()}.pdf`
-						);
-						if (
-							count === o.teams.length &&
-							count_orgs === generate_orgs.length
-						) {
-							toast.dismiss();
-							toast.success($_("pdfs-successfully-generated"));
-						}
-					})
-					.catch((err) => {});
-			}
-		}
-	}
+  async function generateOrgCertificates(locale) {
+    toast.loading($_("generating-pdfs"));
+    const current_donations =
+      (await DonationService.donationControllerGetAll()) || [];
+    let count = 0;
+    let count_orgs = 0;
+    for (const o of generate_orgs) {
+      count_orgs++;
+      let count = 0;
+      let runners =
+        await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+          o.id,
+          true,
+		  true
+        );
+      let certificateRunners = [];
+      for (let runner of runners) {
+        runner.distanceDonations =
+          current_donations.filter((d) => d.runner?.id == runner.id) || [];
+        certificateRunners.push(runner);
+      }
+      await documentServer
+        .generateCertificates(certificateRunners, locale)
+        .then((blob) => {
+          download(
+            blob,
+            `${$_("certificates")}_${o.name}-${locale}-${createId()}.pdf`
+          );
+        })
+        .catch((err) => {});
+      for (const t of o.teams) {
+        count++;
+        let runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+          t.id,
+		  true
+        );
+        let certificateRunners = [];
+        for (let runner of runners) {
+          runner.distanceDonations =
+            current_donations.filter((d) => d.runner?.id == runner.id) || [];
+          certificateRunners.push(runner);
+        }
+        await documentServer
+          .generateCertificates(certificateRunners, locale)
+          .then((blob) => {
+            download(
+              blob,
+              `${$_("certificates")}_${o.name}_${
+                t.name
+              }-${locale}-${createId()}.pdf`
+            );
+            if (
+              count === o.teams.length &&
+              count_orgs === generate_orgs.length
+            ) {
+              toast.dismiss();
+              toast.success($_("pdfs-successfully-generated"));
+            }
+          })
+          .catch((err) => {});
+      }
+    }
+  }
 </script>

 {#if certificates_show}
-	<button
-		on:click={() => {
-			generateCertificates("de");
-		}}
-		class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mb-1 lg:mb-0"
-	>
-		{$_("generate-runner-certificates")}: DE
-	</button>
-	<button
-		on:click={() => {
-			generateCertificates("en");
-		}}
-		class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mb-1 lg:mb-0"
-	>
-		{$_("generate-runner-certificates")}: EN
-	</button>
+  <button
+    on:click={() => {
+      generateCertificates("de");
+    }}
+    class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mb-1 lg:mb-0"
+  >
+    {$_("generate-runner-certificates")}: DE
+  </button>
+  <button
+    on:click={() => {
+      generateCertificates("en");
+    }}
+    class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mb-1 lg:mb-0"
+  >
+    {$_("generate-runner-certificates")}: EN
+  </button>
 {/if}
--- a/src/components/runners/AddRunnerModal.svelte
+++ b/src/components/runners/AddRunnerModal.svelte
@@ -137,7 +137,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -248,7 +248,7 @@
                    >{$_("team")}</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      label.toLowerCase().includes(filterText.toLowerCase()) ||
                      option.value.id
--- a/src/components/runners/DeleteRunnerModal.svelte
+++ b/src/components/runners/DeleteRunnerModal.svelte
@@ -51,7 +51,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/runners/ImportRunnerModal.svelte
+++ b/src/components/runners/ImportRunnerModal.svelte
@@ -1,5 +1,5 @@
 <script>
-	import csv from "csvtojson";
+	import { parse } from "papaparse";
 	import { read as readXlsx, utils as xlsx_utils } from "xlsx";
 	import { _ } from "svelte-i18n";
 	import { clickOutside } from "../base/outsideclick";
@@ -10,7 +10,6 @@
 		RunnerOrganizationService,
 	} from "@odit/lfk-client-js";
 	import { createEventDispatcher } from "svelte";
-	import Select from "svelte-select";
 	import toast from "svelte-french-toast";
 	export let opened_from;
 	export let passed_org;
@@ -46,6 +45,7 @@
 			return { label: r.name, value: `ORG_${r.id}` };
 		});
 		groups = groups.concat(orgs);
+		groups.sort((a, b) => a.label.localeCompare(b.label));
 		RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
 			const teams = val.map((r) => {
 				return {
@@ -54,6 +54,7 @@
 				};
 			});
 			groups = groups.concat(teams);
+			groups.sort((a, b) => a.label.localeCompare(b.label));
 		});
 	});
 	let selected_org;
@@ -62,29 +63,31 @@
 	let recent_processed = true;
 	$: json_output = [];
 	$: {
-		if (files) {
-			if (
-				files[0].type ===
-				"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
-			) {
-				const reader = new FileReader();
-				reader.addEventListener("load", async (e) => {
-					const data = new Uint8Array(e.target.result);
-					const out = readXlsx(data, { type: "array" });
-					json_output = xlsx_utils.sheet_to_json(
-						out.Sheets[Object.keys(out.Sheets)[0]]
-					);
-				});
-				reader.readAsArrayBuffer(files[0]);
-			} else {
-				const reader = new FileReader();
-				reader.addEventListener("load", async (e) => {
-					json_output = await csv({
-						delimiter: [";", ","],
-						trim: true,
-					}).fromString(e.target.result);
-				});
-				reader.readAsText(files[0]);
+		if (json_output.length === 0) {
+			if (files) {
+				if (
+					files[0].type ===
+					"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+				) {
+					const reader = new FileReader();
+					reader.addEventListener("loadend", (e) => {
+						const data = new Uint8Array(e.target.result);
+						const out = readXlsx(data, { type: "array" });
+						json_output = xlsx_utils.sheet_to_json(
+							out.Sheets[Object.keys(out.Sheets)[0]]
+						);
+					});
+					reader.readAsArrayBuffer(files[0]);
+				} else {
+					const reader = new FileReader();
+					reader.addEventListener("loadend", (e) => {
+						json_output = parse(e.target.result, {
+							delimitersToGuess: [";", ","],
+							header: true,
+						}).data;
+					});
+					reader.readAsText(files[0]);
+				}
 			}
 		}
 	}
@@ -207,7 +210,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
--- a/src/components/runners/RunnerDetail.svelte
+++ b/src/components/runners/RunnerDetail.svelte
@@ -52,12 +52,17 @@
 					return { label: r.name, value: r };
 				});
 				groups = groups.concat(orgs);
+				groups.sort((a, b) => a.label.localeCompare(b.label));
 				RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
 					const teams = val.map((r) => {
 						return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
 					});
 					groups = groups.concat(teams);
-					group = groups.find((g) => g.value.id == editable.group);
+					groups.sort((a, b) => a.label.localeCompare(b.label));
+					let tmp_group = groups.find((g) => g.value.id == editable.group);
+					if (tmp_group) {
+						group = tmp_group.value.id;
+					}
 				});
 			}
 		);
@@ -100,7 +105,7 @@
 				<nav class="w-full flex">
 					<ol class="list-none flex flex-row items-center justify-start">
 						<li class="flex items-center">
-							<a class="mr-2" href="./"
+							<a class="mr-2" href="/runners/"
 								><svg
 									xmlns="http://www.w3.org/2000/svg"
 									width="24"
@@ -270,21 +275,14 @@
 		</div>
 		<div class="text-sm w-full mt-2">
 			<span class="font-semibold text-gray-700">{$_("group")}</span>
-			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
-				itemFilter={(label, filterText, option) =>
-					label.toLowerCase().includes(filterText.toLowerCase()) ||
-					option.id.value.toString().startsWith(filterText.toLowerCase())}
-				items={groups}
-				showChevron={true}
-				placeholder={$_("search-for-an-organization-or-team-by-name-or-id")}
-				noOptionsMessage={$_("no-organization-or-team-found")}
-				bind:selectedValue={group}
-				on:select={(selectedValue) => {
-					editable.group = selectedValue.detail.value.id;
-				}}
-				on:clear={() => (editable.group = null)}
-			/>
+			<select
+				class="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				bind:value={editable.group}
+			>
+				{#each groups as g}
+					<option value={g.value.id}>{g.label}</option>
+				{/each}
+			</select>
 		</div>
 		<div class="text-sm w-full mt-2">
 			<span class="font-semibold text-gray-700">{$_("distance")}</span>
@@ -292,7 +290,7 @@
 			<span class="text-gray-700">{original_data.distance / 1000} km</span>
 		</div>
 		<div class="text-sm w-full mt-2">
-			<span class="font-semibold text-gray-700">{$_('created_via')}</span>
+			<span class="font-semibold text-gray-700">{$_("created_via")}</span>
 			<br />
 			<span class="text-gray-700">{original_data.created_via}</span>
 		</div>
--- a/src/components/runners/Runners.svelte
+++ b/src/components/runners/Runners.svelte
@@ -32,6 +32,7 @@

 	$: active_delete = undefined;
 	let dataLoaded = false;
+	export let created_via = "all";
 	export let current_runners = [];
 	$: sponsoring_contracts_show = selected.length > 0;
 	$: cards_show = selected.length > 0;
@@ -75,6 +76,11 @@
 			header: () => $_("last-name"),
 			filterFn: `includesString`,
 		},
+		{
+			accessorKey: "created_via",
+			header: () => "created_via",
+			filterFn: `includesString`,
+		},
 		{
 			accessorKey: "group",
 			header: () => $_("group"),
@@ -86,10 +92,16 @@
 				return `${group.parentGroup.name} > ${group.name}`;
 			},
 			filterFn: `group`,
+			sortingFn: (rowA, rowB, col) => {
+				return rowA.original.group.name.localeCompare(rowB.original.group.name);
+			},
 		},
 		{
 			accessorKey: "distance",
 			header: () => $_("distance"),
+			sortingFn: (rowA, rowB, col) => {
+				return rowA.original.distance > rowB.original.distance;
+			},
 			cell: (info) => {
 				if (info.getValue() < 1000) {
 					return `${info.getValue()} m`;
@@ -103,7 +115,7 @@
 			header: () => $_("action"),
 			cell: (info) => {
 				return renderComponent(TableActions, {
-					detailsLink: `./${info.row.original.id}`,
+					detailsLink: `/runners/${info.row.original.id}`,
 					deleteAction: () => {
 						active_delete =
 							current_runners[
@@ -161,7 +173,11 @@

 		let page = 0;
 		while (page >= 0) {
-			const runners = await RunnerService.runnerControllerGetAll(page, 500);
+			const runners = await RunnerService.runnerControllerGetAll(
+				page,
+				500,
+				created_via
+			);
 			if (runners.length == 0) {
 				page = -2;
 			}
@@ -190,6 +206,9 @@
 	<h4 class="mb-1 text-3xl font-extrabold leading-tight">
 		{$_("runners")}
 	</h4>
+	{#if created_via !== "all"}
+		<p>created_via={created_via}</p>
+	{/if}
 	{#if store.state.jwtinfo.userdetails.permissions.includes("RUNNER:CREATE")}
 		<button
 			on:click={() => {
--- a/src/components/scans/AddScanModal.svelte
+++ b/src/components/scans/AddScanModal.svelte
@@ -88,7 +88,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -131,7 +131,7 @@
                    >{$_("runner")}</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      filterRunners(label, filterText, option)}
                    items={runners}
--- a/src/components/scans/DeleteScanModal.svelte
+++ b/src/components/scans/DeleteScanModal.svelte
@@ -53,7 +53,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/scans/ScanDetail.svelte
+++ b/src/components/scans/ScanDetail.svelte
@@ -218,7 +218,7 @@
 				>{$_("runner")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					filterRunners(label, filterText, option)}
 				items={current_runners}
--- a/src/components/scanstations/AddScanStationModal.svelte
+++ b/src/components/scanstations/AddScanStationModal.svelte
@@ -92,7 +92,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -133,7 +133,7 @@
                    class="block text-sm font-medium text-gray-700">Track</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      label.toLowerCase().includes(filterText.toLowerCase()) ||
                      option.value.id
--- a/src/components/scanstations/ConfirmScanStationDeletion.svelte
+++ b/src/components/scanstations/ConfirmScanStationDeletion.svelte
@@ -42,7 +42,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/scanstations/CopyScanStationTokenModal.svelte
+++ b/src/components/scanstations/CopyScanStationTokenModal.svelte
@@ -1,7 +1,7 @@
 <script>
 	import { _ } from "svelte-i18n";
 	import { tick } from "svelte";
-	import bwipjs from "bwip-js";
+	import { toCanvas } from "@bwip-js/browser";
 	import toast from "svelte-french-toast";

 	export let copy_modal_open;
@@ -51,7 +51,7 @@
 		if (bcid == "code128") {
 			codeconfig.height = 10;
 		}
-		bwipjs.toCanvas(canvas, codeconfig);
+		toCanvas(canvas, codeconfig);
 		return canvas.toDataURL("image/png");
 	}
 </script>
@@ -75,7 +75,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -184,7 +184,9 @@
 						/>
 					</div>
 				</div>
-				<div class="bg-gray-50 px-4 lg:py-3 sm:px-6 grid gap-2 lg:rounded-b-xl pt-3 pb-10">
+				<div
+					class="bg-gray-50 px-4 lg:py-3 sm:px-6 grid gap-2 lg:rounded-b-xl pt-3 pb-10"
+				>
 					<button
 						on:click={close}
 						type="button"
--- a/src/components/scanstations/ScanStations.svelte
+++ b/src/components/scanstations/ScanStations.svelte
@@ -210,7 +210,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b class="capitalize">{$_("general_promise_error")}</b>
+					<b>{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>
--- a/src/components/settings/ConfirmProfileDeletion.svelte
+++ b/src/components/settings/ConfirmProfileDeletion.svelte
@@ -43,7 +43,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/statsclients/AddStatsClientModal.svelte
+++ b/src/components/statsclients/AddStatsClientModal.svelte
@@ -78,7 +78,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/statsclients/ConfirmStatsClientDeletion.svelte
+++ b/src/components/statsclients/ConfirmStatsClientDeletion.svelte
@@ -41,7 +41,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/statsclients/CopyStatsClientTokenModal.svelte
+++ b/src/components/statsclients/CopyStatsClientTokenModal.svelte
@@ -52,7 +52,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/statsclients/StatsClientsOverview.svelte
+++ b/src/components/statsclients/StatsClientsOverview.svelte
@@ -161,7 +161,7 @@
  {:catch error}
    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
      <span class="inline-block align-middle mr-8">
-        <b class="capitalize">{$_("general_promise_error")}</b>
+        <b>{$_("general_promise_error")}</b>
        {error}
      </span>
    </div>
--- a/src/components/teams/AddTeamModal.svelte
+++ b/src/components/teams/AddTeamModal.svelte
@@ -89,7 +89,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
@@ -158,7 +158,7 @@
                    >{$_("organization")}</label
                  >
                  <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                    itemFilter={(label, filterText, option) =>
                      label.toLowerCase().includes(filterText.toLowerCase()) ||
                      option.value.id
--- a/src/components/teams/ConfirmTeamDeletionModal.svelte
+++ b/src/components/teams/ConfirmTeamDeletionModal.svelte
@@ -44,7 +44,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
--- a/src/components/teams/TeamDetail.svelte
+++ b/src/components/teams/TeamDetail.svelte
@@ -212,7 +212,7 @@
 				>{$_("contact")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					label.toLowerCase().includes(filterText.toLowerCase()) ||
 					option.value.id.toString().startsWith(filterText.toLowerCase())}
@@ -231,7 +231,7 @@
 				>{$_("organization")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					label.toLowerCase().includes(filterText.toLowerCase()) ||
 					option.id.value.toString().startsWith(filterText.toLowerCase())}
--- a/src/components/teams/Teams.svelte
+++ b/src/components/teams/Teams.svelte
@@ -215,7 +215,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b class="capitalize">{$_("general_promise_error")}</b>
+					<b>{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>
--- a/src/components/tracks/AddTrackModal.svelte
+++ b/src/components/tracks/AddTrackModal.svelte
@@ -87,7 +87,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/tracks/TracksOverview.svelte
+++ b/src/components/tracks/TracksOverview.svelte
@@ -259,7 +259,7 @@
  {:catch error}
    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
      <span class="inline-block align-middle mr-8">
-        <b class="capitalize">{$_("general_promise_error")}</b>
+        <b>{$_("general_promise_error")}</b>
        {error}
      </span>
    </div>
--- a/src/components/users/AddUserModal.svelte
+++ b/src/components/users/AddUserModal.svelte
@@ -104,7 +104,7 @@
        aria-hidden="true">&#8203;</span
      >
      <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
        role="dialog"
        aria-modal="true"
        aria-labelledby="modal-headline"
--- a/src/components/users/UsersOverview.svelte
+++ b/src/components/users/UsersOverview.svelte
@@ -182,7 +182,7 @@
  {:catch error}
    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
      <span class="inline-block align-middle mr-8">
-        <b class="capitalize">{$_("general_promise_error")}</b>
+        <b>{$_("general_promise_error")}</b>
        {error}
      </span>
    </div>
--- a/src/locales/de.json
+++ b/src/locales/de.json
@@ -64,6 +64,9 @@
    "card-added": "Karte wurde erstellt",
    "card-deleted": "Karte gelöscht",
    "card-updated": "Karte aktualisiert",
+    "card_assignment_for_mobile": "Mobile Kartenzuweisung",
+    "card_assignment_menu": "Kartenzuweisung",
+    "card_not_found": "Läuferkarte nicht gefunden...",
    "cards": "Läuferkarten",
    "cards-deleted": "Karten gelöscht",
    "certificates": "Urkunden",
@@ -74,6 +77,7 @@
    "click-to-copy-token-to-clipboard": "Klicke auf den Token, um ihn in deine Zwischenablage zu kopieren",
    "close": "Schließen",
    "code": "Code",
+    "code_128_barcode": "Code 128 Barcode",
    "config-codes": "Konfigurations-Codes",
    "confirm": "Bestätigen",
    "confirm-delete": "Löschung Bestätigen",
@@ -194,6 +198,7 @@
    "donation_added": "Sponsoring hinzugefügt",
    "donations": "Sponsorings",
    "donations-are-being-loaded": "Sponsorings werden geladen...",
+    "done": "✅ Fertig",
    "donor": "Sponsor",
    "donor-added": "Sponsor hinzugefügt",
    "donor-deleted": "Sponsor gelöscht",
@@ -254,7 +259,6 @@
    "import-runners": "Läufer importieren",
    "import__target-organization": "Ziel Organisation",
    "imprint": "Impressum ",
-    "imprint-loading": "Impressum lädt...",
    "inactive": "Inaktiv",
    "inherited-permissions": "geerbte",
    "installed-version": "Installierte Version",
@@ -296,6 +300,7 @@
    "name": "Name",
    "name-is-required": "Der Gruppenname muss angegeben werden",
    "new-password": "Neues Passwort",
+    "next_runner": "Nächster Läufer",
    "no-address": "Keine Adresse hinterlegt",
    "no-contact-found": "Keine Kontakte gefunden",
    "no-contact-selected": "Kein Kontakt ausgewählt",
@@ -357,9 +362,9 @@
    "please-provide-the-required-information-to-create-a-new-statsclient": "Bitte gebe alle für einen Statsclient notwendigen Informationen an",
    "please-request-a-new-reset-mail": "Bitte eine neue Passwortreset-Mail anfordern...",
    "please-wait-a-moment-your-login-is-still-being-processed": "Bitte warte einen Moment, deine Anmeldung wird verarbeitet",
+    "please_wait_a_moment_while_we_assign_the_card": "Karte wird zugewiesen...",
    "prefix": "Prefix",
    "privacy": "Datenschutz",
-    "privacy-loading": "Datenschutzerklärung lädt...",
    "profile": "Profil",
    "profile-deleted": "Profil gelöscht!",
    "profile-picture": "Profilbild",
@@ -376,18 +381,22 @@
    "runner-import": "Läufer Import",
    "runner-is-being-added": "Läufer wird hinzugefügt...",
    "runner-updated": "Läufer aktualisiert!",
+    "runner_not_found": "Läufer nicht gefunden...",
    "runner_via_selfservice": "Läufer via Selfservice",
    "runnercards": "Laeuferkarten",
    "runnerimport_verify_runners_org": "Bitte die Läufer für den Import in die Organisation \"{org_name}\" bestätigen",
    "runners": "Läufer",
    "runners-are-being-imported": "Läufer werden importiert ...",
    "runners-are-being-loaded": "Läufer werden geladen ...",
+    "runners_via_kiosk": "Läufer via Kiosk",
    "save": "Speichern",
    "save-changes": "Änderungen speichern",
    "scan-added": "Scan hinzugefügt",
    "scan-deleted": "Scan gelöscht",
    "scan-is-being-updated": "Scan wird aktualisiert",
    "scan-with-fixed-distance": "Scan mit Festdistanz",
+    "scan_card": "Läuferkarte scannen",
+    "scan_runner": "Läufer scannen",
    "scans": "Scans",
    "scans-are-being-loaded": "Scans werden geladen",
    "scanstation": "Scanner Station",
@@ -403,6 +412,7 @@
    "select-all": "Alle auswählen",
    "select-language": "Sprache auswählen",
    "selfservice-registration": "Selfservice Registrierung",
+    "selfservice_qr_registration_barcode": "Kiosk QR/ Selfservice Barcode",
    "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
    "set-the-user-active-inactive": "Den Benutzer auf (in)aktiv setzen",
    "settings": "Einstellungen",
@@ -471,6 +481,7 @@
    "track-updated": "Laufstrecke aktualisiert",
    "track-was-updated": "Laufstrecke wurde aktualisiert",
    "tracks": "Laufstrecken",
+    "try_again": "erneut versuchen",
    "unpaid": "Offen",
    "update-card": "Karte aktualisieren",
    "update-password": "Passwort ändern",
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -64,6 +64,9 @@
    "card-added": "Card added",
    "card-deleted": "Card deleted",
    "card-updated": "Card updated",
+    "card_assignment_for_mobile": "Card Assignment for Mobile",
+    "card_assignment_menu": "Card Assignment",
+    "card_not_found": "Card not found...",
    "cards": "Cards",
    "cards-deleted": "Cards deleted",
    "certificates": "Certificates",
@@ -74,6 +77,7 @@
    "click-to-copy-token-to-clipboard": "Click to copy the token to your clipboard",
    "close": "Close",
    "code": "Code",
+    "code_128_barcode": "Code 128 Barcode",
    "config-codes": "Config codes",
    "confirm": "Confirm",
    "confirm-delete": "Confirm Delete",
@@ -194,6 +198,7 @@
    "donation_added": "Donation_added",
    "donations": "Donations",
    "donations-are-being-loaded": "donations are being loaded",
+    "done": "✅ Done",
    "donor": "Donor",
    "donor-added": "Donor added",
    "donor-deleted": "donor deleted",
@@ -254,7 +259,6 @@
    "import-runners": "Import runners",
    "import__target-organization": "Target Organization",
    "imprint": "Imprint",
-    "imprint-loading": "Imprint loading...",
    "inactive": "Inactive",
    "inherited-permissions": "inherited",
    "installed-version": "Installed version",
@@ -296,6 +300,7 @@
    "name": "Name",
    "name-is-required": "Name is required",
    "new-password": "New password",
+    "next_runner": "Next Runner",
    "no-address": "no address",
    "no-contact-found": "No contacts found",
    "no-contact-selected": "No contact selected",
@@ -357,9 +362,9 @@
    "please-provide-the-required-information-to-create-a-new-statsclient": "Please provide the required information to create a new statsclient",
    "please-request-a-new-reset-mail": "Please request a new reset mail...",
    "please-wait-a-moment-your-login-is-still-being-processed": "Please wait a moment, your login is still being processed",
+    "please_wait_a_moment_while_we_assign_the_card": "Please wait a moment while we assign the card...",
    "prefix": "Prefix",
    "privacy": "Privacy",
-    "privacy-loading": "Privacy loading...",
    "profile": "Profile",
    "profile-deleted": "Profile deleted!",
    "profile-picture": "Profile Picture",
@@ -376,18 +381,22 @@
    "runner-import": "Runner Import",
    "runner-is-being-added": "Runner is being added...",
    "runner-updated": "Runner updated!",
+    "runner_not_found": "Runner not found...",
    "runner_via_selfservice": "Runner via Selfservice",
    "runnercards": "Runnercards",
    "runnerimport_verify_runners_org": "Please confirm these runners for import into the organization \"{org_name}\"",
    "runners": "Runners",
    "runners-are-being-imported": "Runners are being imported...",
    "runners-are-being-loaded": "runners are being loaded...",
+    "runners_via_kiosk": "Runners via Kiosk",
    "save": "Save",
    "save-changes": "Save Changes",
    "scan-added": "Scan added",
    "scan-deleted": "scan deleted",
    "scan-is-being-updated": "Scan is being updated",
    "scan-with-fixed-distance": "Scan with fixed distance",
+    "scan_card": "Scan Card",
+    "scan_runner": "Scan Runner",
    "scans": "Scans",
    "scans-are-being-loaded": "Scans are being loaded",
    "scanstation": "Scanstation",
@@ -403,6 +412,7 @@
    "select-all": "select all",
    "select-language": "Select language",
    "selfservice-registration": "Selfservice registration",
+    "selfservice_qr_registration_barcode": "Kiosk QR/ Selfservice Barcode",
    "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
    "set-the-user-active-inactive": "set the user active/ inactive",
    "settings": "Settings",
@@ -471,6 +481,7 @@
    "track-updated": "Track deleted",
    "track-was-updated": "Track was updated!",
    "tracks": "Tracks",
+    "try_again": "Try Again",
    "unpaid": "Unpaid",
    "update-card": "Update Card",
    "update-password": "Update password",
--- a/src/style.css
+++ b/src/style.css
@@ -1,10 +1,9 @@
-@tailwind base;
-@tailwind components;
+@import "tailwindcss";
+
 .activenav {
-  @apply bg-gray-300;
-  @apply text-black;
+	@apply bg-gray-300;
+	@apply text-black;
 }
 * {
-  font-family: Athiti;
+	font-family: Athiti;
 }
-@tailwind utilities;
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -1,16 +0,0 @@
-module.exports = {
-  darkMode: 'selector',
-  mode: "jit",
-  content: ["./src/**/*.svelte"],
-  theme: {
-    extend: {
-      colors: {
-        reepolee: {
-          500: "#b40000",
-          600: "#9c0000",
-          700: "#750000",
-        },
-      },
-    },
-  },
-};
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,11 +1,8 @@
 // vite.config.js
 import { defineConfig } from "vite";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
+import tailwindcss from "@tailwindcss/vite";

 export default defineConfig({
-  plugins: [
-    svelte({
-      /* plugin options */
-    }),
-  ],
+	plugins: [svelte(), tailwindcss()],
 });
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
Nicolai Ort	98a3b07237	chore(release): 1.11.3 All checks were successful Build release images / build-container (push) Successful in 1m0s Details	2025-04-25 14:53:55 +02:00
Nicolai Ort	efad6fdf2e	fix(cards): Z-Index for bulk card modal	2025-04-25 14:53:36 +02:00
Nicolai Ort	bce6d484a9	chore(deps): Updated lock	2025-04-25 14:51:47 +02:00
Philipp Dormann	2dea19df89	chore(release): 1.11.2 All checks were successful Build release images / build-container (push) Successful in 1m1s Details	2025-04-23 11:01:55 +02:00
Philipp Dormann	6c986467d3	fix(cardassignment): handle card not found	2025-04-23 11:01:06 +02:00
Philipp Dormann	3cedbebe40	chore(release): 1.11.1 All checks were successful Build release images / build-container (push) Successful in 1m2s Details	2025-04-22 22:28:19 +02:00
Philipp Dormann	dc986e4fe5	ci: fix build	2025-04-22 22:27:53 +02:00
Philipp Dormann	cae6be6f86	chore(release): 1.11.0 Some checks failed Build release images / build-container (push) Failing after 31s Details	2025-04-22 22:26:14 +02:00
Philipp Dormann	1d6ed99073	fix(cardassignment): debounce w/ immediate start	2025-04-22 22:25:54 +02:00
Philipp Dormann	1605b0f7b2	feat(cards): badge style for runner links	2025-04-22 22:05:29 +02:00
Philipp Dormann	244be471f0	chore(deps): bump - vite@6 - @bwip-js/browser - svelte-i18n@4 - migrate from csvtojson to papaparse	2025-04-22 22:03:23 +02:00
Philipp Dormann	a12c4f87d2	fix: modal position & z index	2025-04-22 21:59:15 +02:00
Philipp Dormann	312457494c	feat(ImportRunnerModal): sort groups by name	2025-04-22 21:57:59 +02:00
Philipp Dormann	3288ffb3cc	chore: move privacy & imprint to website links	2025-04-22 21:19:00 +02:00
Philipp Dormann	81a8ce002c	chore: move to tailwind v4	2025-04-22 21:18:19 +02:00
Philipp Dormann	e1bf435080	fix(RunnerDetail): move to standard html select for groups	2025-04-22 21:15:56 +02:00
Philipp Dormann	80ab4e037e	chore: tailwind class cleanup	2025-04-22 21:15:18 +02:00
Philipp Dormann	3fab344779	chore(release): 1.10.6 All checks were successful Build release images / build-container (push) Successful in 1m3s Details	2025-04-22 19:11:14 +02:00
Philipp Dormann	d841727439	feat: improved mobile card assignment commit `062daa6a0c` Author: Philipp Dormann <philipp@philippdormann.de> Date: Tue Apr 22 19:10:26 2025 +0200 wip commit `cfc3c44f9f` Author: Philipp Dormann <philipp@philippdormann.de> Date: Tue Apr 22 19:09:19 2025 +0200 wip commit `d2bc780656` Author: Philipp Dormann <philipp@philippdormann.de> Date: Tue Apr 22 19:09:02 2025 +0200 wip commit `dc5ea5240c` Author: Philipp Dormann <philipp@philippdormann.de> Date: Tue Apr 22 18:48:25 2025 +0200 wip commit `fcadedaa30` Author: Philipp Dormann <philipp@philippdormann.de> Date: Tue Apr 22 18:47:41 2025 +0200 wip commit `2a4fe2b28f` Author: Philipp Dormann <philipp@philippdormann.de> Date: Tue Apr 22 18:40:26 2025 +0200 wip	2025-04-22 19:10:57 +02:00
Philipp Dormann	87df34bb56	chore(release): 1.10.5 All checks were successful Build release images / build-container (push) Successful in 1m0s Details	2025-04-22 17:47:22 +02:00
Philipp Dormann	9c3b742a98	feat(runners): add distance sorting	2025-04-22 17:47:04 +02:00
Nicolai Ort	68bf3717f9	chore(release): 1.10.4 All checks were successful Build release images / build-container (push) Successful in 1m0s Details	2025-04-22 17:27:18 +02:00
Nicolai Ort	f88c6e0dba	fix(runners): Fix runner overview sort	2025-04-22 17:26:18 +02:00
Nicolai Ort	12050cdda9	chore(release): 1.10.3 All checks were successful Build release images / build-container (push) Successful in 1m24s Details	2025-04-17 21:15:58 +02:00
Nicolai Ort	01e77a97f3	feat(pdf): Send selfservicelink for generation	2025-04-17 21:13:15 +02:00
Nicolai Ort	10824b5d9b	chore(deps): Bump @odit/lfk-client-js	2025-04-17 21:03:28 +02:00
Philipp Dormann	d9870e03bc	chore(release): 1.10.2 All checks were successful Build release images / build-container (push) Successful in 1m0s Details	2025-04-11 12:24:49 +02:00
Philipp Dormann	785b9e0b60	refactor(runners): filter table for created_via	2025-04-11 12:24:02 +02:00
Philipp Dormann	fce2bc645e	chore(release): 1.10.1 All checks were successful Build release images / build-container (push) Successful in 1m1s Details	2025-04-09 11:57:16 +02:00
Philipp Dormann	991716a7f5	feat: runner list filtered by created_via	2025-04-09 11:56:59 +02:00
Philipp Dormann	aa720f2460	chore(release): 1.10.0 All checks were successful Build release images / build-container (push) Successful in 1m1s Details	2025-04-09 10:39:06 +02:00
Philipp Dormann	ac4ef8fb6d	feat: working CardAssignment	2025-04-09 10:38:45 +02:00
Philipp Dormann	eae0afda23	chore(release): 1.9.11 All checks were successful Build release images / build-container (push) Successful in 57s Details	2025-04-08 22:17:04 +02:00
Philipp Dormann	5291f8a4d1	feat(dash): add runnersViaKiosk	2025-04-08 22:16:46 +02:00
				`@@ -1 +0,0 @@`
				Nostrud tempor dolor aute ea excepteur aute mollit elit eiusmod exercitation. Magna laborum pariatur adipisicing pariatur cupidatat exercitation duis aliquip pariatur sint exercitation deserunt labore. Consectetur id laboris dolore nostrud do velit ipsum. Eu laboris velit do commodo ad ea sint ex cillum. Cillum ipsum qui eiusmod laborum mollit sunt dolore incididunt. Cillum sunt culpa veniam voluptate et qui ut magna anim occaecat ut mollit dolor. Duis irure proident eu incididunt dolore sunt nisi aute dolore amet eu fugiat laboris quis.