diff --git a/.env.example b/.env.example
index dede689..86f11ce 100644
--- a/.env.example
+++ b/.env.example
@@ -1,2 +1,5 @@
 API_URL='http://localhost:8000'
+DUMMY=false
 GITHUB_TOKEN='YOUR_GITHUB_TOKEN'
+
+LOGGER_LAYER_URI=github:DCC-BS/nuxt-layers/pino-logger
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index f5251c8..041977f 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -9,7 +9,7 @@ on:
             - main
 
 jobs:
-    build:
+    ci:
         runs-on: ubuntu-latest
         steps:
             - uses: DCC-BS/ci-workflows/actions/node-bun-biome-playwright@v8
@@ -20,6 +20,5 @@ jobs:
                   run_playwright: "false"
                   install_method: "bun"
                   build_command: "bun run build"
-                  test_command: "bunx playwright test"
-                  artifact_name: "playwright-report"
-                  artifact_retention_days: 30
+            - name: test
+              run: bun run test
diff --git a/.github/workflows/docker-publish.yml b/.github/workflows/docker-publish.yml
index 908c317..5e2977f 100644
--- a/.github/workflows/docker-publish.yml
+++ b/.github/workflows/docker-publish.yml
@@ -1,13 +1,6 @@
 name: Build and Publish Docker Image
 on:
     workflow_dispatch:
-        inputs:
-            version_bump:
-                description: Version bump type
-                required: true
-                default: patch
-                type: choice
-                options: [major, minor, patch]
 
 permissions:
     contents: write
@@ -18,7 +11,6 @@ jobs:
         uses: DCC-BS/ci-workflows/.github/workflows/publish-docker.yml@v8
         secrets: inherit
         with:
-            release_type: ${{ inputs.version_bump }} # major|minor|patch
             version_project_type: "node" # or "python"
             registry: ghcr.io
             image_name: ghcr.io/${{ github.repository }}
diff --git a/.gitignore b/.gitignore
index a420bdc..95664fe 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,3 +23,5 @@ logs
 .env.*
 !.env.example
 !docker/.env.backend.example
+
+.worktreees/*
diff --git a/.nuxtrc b/.nuxtrc
new file mode 100644
index 0000000..1e1fe83
--- /dev/null
+++ b/.nuxtrc
@@ -0,0 +1 @@
+setups.@nuxt/test-utils="4.0.0"
\ No newline at end of file
diff --git a/AGENTS.md b/AGENTS.md
new file mode 100644
index 0000000..6079175
--- /dev/null
+++ b/AGENTS.md
@@ -0,0 +1,132 @@
+# Transcribo Frontend - Agent Coding Guidelines
+
+## Build & Development Commands
+
+```bash
+# Install dependencies (Bun required, not npm)
+bun install
+
+# Development server
+bun run dev
+
+# Build for production
+bun run build
+
+# Start production server
+bun run start
+
+# Generate static site
+bun run generate
+
+# Linting & Formatting
+bun run lint      # Biome format --write
+bun run check     # Biome check --fix
+
+# Docker
+bun run docker:dev       # Start dev container
+bun run docker:dev:down  # Stop dev container
+bun run docker:prod      # Start production container
+bun run docker:prod:down # Stop production container
+```
+
+## Package Manager
+**Use `bun` for all package operations, NOT npm.**
+
+## Code Style Guidelines
+
+### TypeScript & Vue
+- **Always use Composition API** (`<script setup lang="ts">`)
+- **Never use `any` type** - use `unknown` with validation or specific types
+- **Never use non-null assertion `!`** - structure code so TypeScript understands nullable values
+- **Always use semicolons** - terminate all statements
+- **Prefer undefined over null** - use `ref(undefined)` not `ref(null)`
+- **Non-null refs** - initialize refs with values, not null
+- **Explicit types** - function parameters and return types must be typed
+- **Function declarations** - use `function foo()` not `const foo = () => {}`
+- **Async/await** - prefer over promise chains
+
+### Naming Conventions
+- **Pages**: kebab-case (`user-profile.vue`)
+- **Components**: PascalCase (`UserProfileCard.vue`)
+- **Composables**: camelCase with `use` prefix (`useCounter.ts`)
+- **Server API**: kebab-case (`user-account.get.ts`)
+- **Utils/Services**: camelCase (`formatDate.ts`)
+
+### Import Aliases
+```typescript
+~/        // app/ directory
+~~/       // root directory
+~~/server  // server directory
+```
+
+### UI & Styling
+- **Use Nuxt UI components** instead of custom implementations
+- **Use Tailwind CSS** for styling (native, no custom CSS when possible)
+- **Use Lucide icons** (auto-imported via Nuxt UI)
+- **Use motion** for animations (auto-imported via `motion-v`)
+
+### Formatting (Biome)
+- 4 space indentation
+- Double quotes for strings
+- Semicolons required
+- `organizeImports` enabled
+
+## Key Conventions from Cursor/Copilot Rules
+- Use `===` and `!==` for equality
+- No `console` in production code
+- No `@ts-ignore` - always fix type errors
+- No TypeScript enums
+- No reassigning function parameters
+- No unused imports/variables (ignored in .vue files)
+- Use `for-of` instead of `forEach`
+- Use `Array.isArray()` instead of `instanceof Array`
+- Throw Error objects with messages
+- Handle async errors properly with try/catch
+
+## Project Structure
+```
+app/
+  components/    # Vue components (PascalCase)
+  composables/   # use* functions (camelCase) + other composables
+  pages/         # Routes (kebab-case)
+  utils/         # Framework-agnostic utilities
+  services/      # API/business logic (e.g., indexDbService.ts)
+  types/         # TypeScript definitions
+  plugins/       # Nuxt plugins (e.g., api.ts, konvaPlugin.client.ts)
+  layouts/       # Page layouts (default.vue, edit.vue)
+  assets/        # Static assets (CSS, images, disclaimer.html)
+server/
+  api/           # API endpoints (kebab-case with HTTP method suffix)
+  utils/         # Server utilities
+  changelogs/    # Version changelog markdown files
+  tsconfig.json  # Server-specific TypeScript config
+public/
+  ios/           # PWA icons for iOS
+  icons.json     # PWA icon configuration
+```
+
+## Key Dependencies
+- **Nuxt UI 4.x** - Component library
+- **@ffmpeg/ffmpeg** - Audio/video processing in browser
+- **dexie** - IndexedDB wrapper for local storage
+- **konva / vue-konva** - Canvas rendering for timeline editor
+- **ts-pattern** - Pattern matching
+- **zod** - Runtime type validation
+- **motion-v** - Vue animations
+
+## Nuxt Features
+- Auto-imports enabled for composables, utils, components
+- TypeScript strict mode enabled
+- Pinia for state management
+- Nuxt UI for components
+- i18n for internationalization (en, de)
+- PWA support via @vite-pwa/nuxt
+- Extends GitHub layers: backend_communication, health_check, feedback-control, logger
+
+## Testing
+- No test framework currently configured
+- Tests should be added when implementing new features
+
+## Before Committing
+1. Run `bun run check` - fix all linting issues
+2. Run `bun run build` - ensure production build works
diff --git a/app/app.config.ts b/app/app.config.ts
new file mode 100644
index 0000000..bde8b8e
--- /dev/null
+++ b/app/app.config.ts
@@ -0,0 +1,12 @@
+export default defineAppConfig({
+    // ui: {
+    //     colors: {
+    //         primary: "purple",
+    //         secondary: "teal",
+    //         success: "green",
+    //         info: "blue",
+    //         warning: "yellow",
+    //         error: "red",
+    //     },
+    // },
+});
diff --git a/app/app.vue b/app/app.vue
index b0f701d..654e396 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -10,6 +10,8 @@ const disclaimerText = disclaimerTextRaw as string;
 const { isOpen, title, message, onSubmit, onClose } = useInitDialog();
 const { undo, redo, canUndo, canRedo } = useCommandHistory();
 
+const appConfig = useAppConfig();
+
 onMounted(() => {
     window.addEventListener("keydown", handleKeyDown);
 });
@@ -32,7 +34,6 @@ function handleKeyDown(event: KeyboardEvent) {
 <template>
     <NuxtPwaManifest />
     <Changelogs />
-    <FeedbackControl />
     <Disclaimer
         app-name="Transcribo"
         :postfixHTML="disclaimerText"
diff --git a/app/components/AudioRecordingView.client.vue b/app/components/AudioRecordingView.client.vue
index dfe6358..8e8de1f 100644
--- a/app/components/AudioRecordingView.client.vue
+++ b/app/components/AudioRecordingView.client.vue
@@ -17,7 +17,6 @@ const { isReady, abandonedRecording } =
         logger: debugLog,
     });
 
-const audioRecorder = ref<typeof AudioRecorder>();
 const shouldRecord = ref(false);
 const isRecording = ref(false);
 const audioBlob = ref<Blob | undefined>(undefined);
@@ -27,6 +26,7 @@ function onRecordingStopped(file: Blob, _: string) {
     isRecording.value = false;
     audioBlob.value = file;
     userRecording.value = true;
+    emitAudio();
 }
 
 function emitAudio(): void {
@@ -62,10 +62,6 @@ const audioSessionActions = computed(() => [
             t("pages.index.recordAudio") }}</UButton>
     </div>
     <div v-if="isReady && shouldRecord">
-        <AudioRecorder ref="audioRecorder" :logger="debugLog" auto-start :show-result="true"
-            @recording-stopped="onRecordingStopped" />
-        <div v-if="audioBlob" class="flex flex-col justify-center items-center mt-4">
-            <UButton @click="emitAudio">{{ t("audioRecorder.useRecording") }}</UButton>
-        </div>
+        <AudioRecorder :logger="debugLog" auto-start :show-result="true" @recording-stopped="onRecordingStopped" />
     </div>
-</template>
\ No newline at end of file
+</template>
diff --git a/app/components/EditorModeSelector.vue b/app/components/EditorModeSelector.vue
new file mode 100644
index 0000000..74ac6ab
--- /dev/null
+++ b/app/components/EditorModeSelector.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { motion } from "motion-v";
+import { UButton } from "#components";
+
+type EditorMode = "view" | "summary" | "edit" | "statistics";
+
+const UButtonMotion = motion.create(UButton);
+
+const props = withDefaults(
+    defineProps<{ idPrefix?: string }>(),
+    { idPrefix: "" }
+);
+
+const mode = defineModel<EditorMode>({ default: "view" });
+
+const { t } = useI18n();
+
+const modes: { value: EditorMode; icon: string; label: string }[] = [
+    { value: "view", icon: "i-lucide-eye", label: "viewer" },
+    { value: "summary", icon: "i-lucide-sparkles", label: "summary" },
+    { value: "edit", icon: "i-lucide-square-pen", label: "editor" },
+    { value: "statistics", icon: "i-lucide-bar-chart-2", label: "statistics" },
+];
+</script>
+
+<template>
+    <div :id="`${props.idPrefix}editor-mode-selector`" class="editor-mode-selector">
+        <UFieldGroup>
+            <UButtonMotion
+                v-for="(m, index) in modes"
+                :key="m.value"
+                :variant="mode === m.value ? 'solid' : 'soft'"
+                color="primary"
+                :whileHover="{ scale: 1.02 }"
+                :whileTap="{ scale: 0.98 }"
+                :transition="{
+                    type: 'spring' as const,
+                    stiffness: 400,
+                    damping: 17,
+                }"
+                @click="mode = m.value"
+                :id="`${props.idPrefix}mode-${m.value}`"
+            >
+                <UIcon :name="m.icon" class="w-4 h-4" />
+                <span>{{ t(`mode.${m.label}`) }}</span>
+            </UButtonMotion>
+        </UFieldGroup>
+    </div>
+</template>
diff --git a/app/components/ExportToolbar.vue b/app/components/ExportToolbar.vue
index 8f8f44d..bdbf77a 100644
--- a/app/components/ExportToolbar.vue
+++ b/app/components/ExportToolbar.vue
@@ -1,75 +1,122 @@
 <script lang="ts" setup>
 import type { ExportOptions } from "~/composables/export";
+import type { StoredTranscription } from "~/types/storedTranscription";
+
+interface InputProps {
+    transcription: StoredTranscription;
+}
+
+const props = defineProps<InputProps>();
 
 const { t } = useI18n();
-const { exportAsText, exportAsSrt, exportAsJson } = useExport();
-const transcriptionStore = useTranscriptionsStore();
+const { exportAsText, exportAsSrt, exportAsJson, exportAsDocx } = useExport();
 
 // Export options state
-const exportOptions = ref<ExportOptions>({
-    withSpeakers: true,
-    withTimestamps: true,
-    mergeSegments: false,
-    withSummary: false,
-});
+const withSpeakers = useLocalStorage<boolean>("setting:show-speaker", true);
+const withTimestamps = useLocalStorage<boolean>(
+    "setting:show-timestamps",
+    false,
+);
+const mergeSegments = useLocalStorage<boolean>("setting:merge-segments", true);
+const withSummary = ref(false);
+
+const exportOptions = computed<Omit<ExportOptions, "transcription">>(() => ({
+    withSpeakers: withSpeakers.value,
+    withTimestamps: withTimestamps.value,
+    mergeSegments: mergeSegments.value,
+    withSummary: withSummary.value,
+}));
 
 // Functions to handle exports
 function handleTextExport(): void {
-    exportAsText(exportOptions.value);
+    exportAsText({
+        ...exportOptions.value,
+        transcription: props.transcription,
+    });
 }
 
 function handleSubtitleExport(): void {
-    exportAsSrt(exportOptions.value.withSpeakers);
+    exportAsSrt(props.transcription, exportOptions.value.withSpeakers);
 }
 
 function handleJsonExport(): void {
-    exportAsJson();
+    exportAsJson(props.transcription);
+}
+
+async function handleDocxExport(): Promise<void> {
+    await exportAsDocx({
+        ...exportOptions.value,
+        transcription: props.transcription,
+    });
 }
 </script>
 
 <template>
     <UPopover>
-        <UButton icon="i-lucide-download" :label="t('export.export')" trailing-icon="i-lucide-chevron-down"
-            color="primary" />
+        <UButton
+            id="export-toolbar"
+            icon="i-lucide-download"
+            :label="t('export.export')"
+            trailing-icon="i-lucide-chevron-down"
+            color="primary"
+        />
 
         <template #content>
             <div class="p-4 w-80">
                 <!-- Export Options Section -->
                 <div class="mb-4">
-                    <h4 class="font-medium text-sm mb-3">{{ t('export.optionsTitle') }}</h4>
+                    <h4 class="font-medium text-sm mb-3">
+                        {{ t("export.optionsTitle") }}
+                    </h4>
 
                     <!-- Speaker information toggle -->
                     <div class="flex items-center justify-between mb-2">
-                        <span class="text-sm">{{ t('export.withSpeakers') }}</span>
-                        <USwitch v-model="exportOptions.withSpeakers" />
+                        <span class="text-sm">{{
+                            t("export.withSpeakers")
+                        }}</span>
+                        <USwitch v-model="withSpeakers" />
                     </div>
 
                     <!-- Timestamps toggle (text only) -->
                     <div class="flex items-center justify-between mb-2">
                         <div class="flex flex-col">
-                            <span class="text-sm">{{ t('export.withTimestamps') }}</span>
-                            <span class="text-xs text-gray-500">{{ t('export.textOnly') }}</span>
+                            <span class="text-sm">{{
+                                t("export.withTimestamps")
+                            }}</span>
+                            <span class="text-xs text-gray-500">{{
+                                t("export.textOnly")
+                            }}</span>
                         </div>
-                        <USwitch v-model="exportOptions.withTimestamps" />
+                        <USwitch v-model="withTimestamps" />
                     </div>
 
                     <!-- Merge segments toggle (text only) -->
                     <div class="flex items-center justify-between mb-2">
                         <div class="flex flex-col">
-                            <span class="text-sm">{{ t('export.mergeSegments') }}</span>
-                            <span class="text-xs text-gray-500">{{ t('export.textOnly') }}</span>
+                            <span class="text-sm">{{
+                                t("export.mergeSegments")
+                            }}</span>
+                            <span class="text-xs text-gray-500">{{
+                                t("export.textOnly")
+                            }}</span>
                         </div>
-                        <USwitch v-model="exportOptions.mergeSegments" />
+                        <USwitch v-model="mergeSegments" />
                     </div>
 
                     <!-- Meeting summary toggle (text only) -->
-                    <div v-if="transcriptionStore.currentTranscription?.summary"
-                        class="flex items-center justify-between mb-3">
+                    <div
+                        v-if="props.transcription.summary"
+                        class="flex items-center justify-between mb-3"
+                    >
                         <div class="flex flex-col">
-                            <span class="text-sm">{{ t('export.withSummary') }}</span>
-                            <span class="text-xs text-gray-500">{{ t('export.textOnly') }}</span>
+                            <span class="text-sm">{{
+                                t("export.withSummary")
+                            }}</span>
+                            <span class="text-xs text-gray-500">{{
+                                t("export.textOnly")
+                            }}</span>
                         </div>
-                        <USwitch v-model="exportOptions.withSummary" />
+                        <USwitch v-model="withSummary" />
                     </div>
                 </div>
 
@@ -78,19 +125,53 @@ function handleJsonExport(): void {
 
                 <!-- Export Format Buttons -->
                 <div class="space-y-2">
-                    <h4 class="font-medium text-sm mb-2">{{ t('export.formats.title') }}</h4>
+                    <h4 class="font-medium text-sm mb-2">
+                        {{ t("export.formats.title") }}
+                    </h4>
 
                     <!-- Text Format -->
-                    <UButton block variant="ghost" color="primary" icon="i-lucide-file-text"
-                        :label="t('export.formats.text')" @click="handleTextExport" class="justify-start" />
+                    <UButton
+                        block
+                        variant="ghost"
+                        color="primary"
+                        icon="i-lucide-file-text"
+                        :label="t('export.formats.text')"
+                        @click="handleTextExport"
+                        class="justify-start"
+                    />
 
                     <!-- Subtitle Format -->
-                    <UButton block variant="ghost" color="primary" icon="i-lucide-message-square-text"
-                        :label="t('export.formats.subtitle')" @click="handleSubtitleExport" class="justify-start" />
+                    <UButton
+                        block
+                        variant="ghost"
+                        color="primary"
+                        icon="i-lucide-message-square-text"
+                        :label="t('export.formats.subtitle')"
+                        @click="handleSubtitleExport"
+                        class="justify-start"
+                    />
 
                     <!-- Json Format -->
-                    <UButton block variant="ghost" color="primary" icon="i-lucide-file-braces"
-                        :label="t('export.formats.json')" @click="handleJsonExport" class="justify-start" />
+                    <UButton
+                        block
+                        variant="ghost"
+                        color="primary"
+                        icon="i-lucide-file-braces"
+                        :label="t('export.formats.json')"
+                        @click="handleJsonExport"
+                        class="justify-start"
+                    />
+
+                    <!-- Docx Format -->
+                    <UButton
+                        block
+                        variant="ghost"
+                        color="primary"
+                        icon="i-lucide-file-type"
+                        :label="t('export.formats.docx')"
+                        @click="handleDocxExport"
+                        class="justify-start"
+                    />
                 </div>
             </div>
         </template>
diff --git a/app/components/HContainer.vue b/app/components/HContainer.vue
new file mode 100644
index 0000000..7fb5990
--- /dev/null
+++ b/app/components/HContainer.vue
@@ -0,0 +1,11 @@
+<template>
+    <div class="flex flex-col m-2 ring-1 ring-default rounded-md shadow-[2px_2px_1px_1px_#0000000D]">
+        <div class="border-b border-default p-2">
+            <slot name="top" />
+        </div>
+
+        <div class="flex grow min-h-0 p-2">
+            <slot />
+        </div>
+    </div>
+</template>
diff --git a/app/components/LoadingView.vue b/app/components/LoadingView.vue
new file mode 100644
index 0000000..b131927
--- /dev/null
+++ b/app/components/LoadingView.vue
@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import { motion } from "motion-v";
+
+interface InputProps {
+    loadingText?: string
+}
+
+const props = withDefaults(defineProps<InputProps>(), {
+    loadingText: ""
+});
+</script>
+
+<template>
+        <div class="flex items-center justify-center min-h-[60vh]">
+            <motion.div :animate="{ opacity: 1, scale: 1 }" :initial="{ opacity: 0, scale: 0.9 }"
+                :transition="{ duration: 0.3 }" class="flex flex-col items-center gap-4">
+                <div class="relative">
+                    <div class="w-16 h-16 border-4 border-primary-200 dark:border-primary-900 rounded-full" />
+                    <div
+                        class="absolute top-0 left-0 w-16 h-16 border-4 border-transparent border-t-primary-500 rounded-full animate-spin" />
+                </div>
+                <p class="text-gray-500 dark:text-gray-400 font-medium animate-pulse">
+                    {{ props.loadingText }}
+                </p>
+            </motion.div>
+        </div>
+</template>
diff --git a/app/components/MediaEditor.vue b/app/components/MediaEditor.vue
deleted file mode 100644
index 37f48d2..0000000
--- a/app/components/MediaEditor.vue
+++ /dev/null
@@ -1,223 +0,0 @@
-<script lang="ts" setup>
-import { match } from "ts-pattern";
-import { SeekToSecondsCommand, TogglePlayCommand } from "~/types/commands";
-import AudioSpectrogram from "./media/AudioSpectrogram.vue";
-import CurrentSegementEditor from "./media/CurrentSegementEditor.vue";
-import TimelineView from "./media/TimelineView.client.vue";
-import VideoView from "./media/VideoView.vue";
-import RenameSpeakerView from "./RenameSpeakerView.vue";
-
-const audioFile = ref<Blob>(); // Reference to the uploaded audio file
-const currentTime = ref<number>(0); // Current playback position in seconds
-const duration = ref<number>(0); // Total audio duration in seconds
-const timeRange = ref<[number, number]>([0, duration.value]);
-
-const zoomX = computed(
-    () => duration.value / (timeRange.value[1] - timeRange.value[0]),
-);
-
-const transcriptionStore = useTranscriptionsStore();
-const { executeCommand } = useCommandBus();
-
-onMounted(() => {
-    duration.value = 0;
-    const currentTranscription = transcriptionStore.currentTranscription;
-
-    if (!currentTranscription?.mediaFile) {
-        return;
-    }
-
-    audioFile.value = currentTranscription.mediaFile;
-    const audioSrc = URL.createObjectURL(audioFile.value);
-
-    // calculate duration
-    const audio = new Audio();
-    audio.src = audioSrc;
-
-    audio.onloadedmetadata = () => {
-        duration.value = audio.duration;
-        timeRange.value = [0, audio.duration];
-
-        URL.revokeObjectURL(audioSrc);
-        audio.onloadedmetadata = null;
-    };
-
-    currentTime.value = 0;
-});
-
-function handleWheel(event: WheelEvent): void {
-    const delta = event.deltaY * -0.1;
-
-    const target = event.target as HTMLElement;
-    const w = target.clientWidth;
-    const x = event.offsetX;
-
-    const startFactor = x / w;
-    const endFactor = 1 - startFactor;
-
-    const start = timeRange.value[0] + delta * startFactor;
-    const end = timeRange.value[1] - delta * endFactor;
-
-    event.preventDefault();
-
-    if (end <= start + 0.01) {
-        return;
-    }
-
-    timeRange.value[0] = Math.max(0, start);
-    timeRange.value[1] = Math.min(duration.value, end);
-}
-
-const mouseDownStart = ref<number>();
-
-function handleMouseDown(event: MouseEvent) {
-    if (event.ctrlKey) {
-        mouseDownStart.value = event.clientX;
-        event.preventDefault();
-        event.stopPropagation();
-    }
-}
-
-function handleMouseUp(_: MouseEvent) {
-    mouseDownStart.value = undefined;
-}
-
-function handleMouseMove(event: MouseEvent) {
-    if (mouseDownStart.value !== undefined) {
-        // Calculate how many pixels we moved
-        const pixelDelta = event.clientX - mouseDownStart.value;
-
-        // Convert pixels to time using the current zoom level
-        // Negative because dragging left (negative pixels) should move timeline right (positive time)
-        const timeDelta = -pixelDelta / zoomX.value;
-
-        // Calculate new time range
-        const start = timeRange.value[0] + timeDelta;
-        const end = timeRange.value[1] + timeDelta;
-
-        // Safety checks
-        if (start < 0) {
-            // Don't go before the beginning
-            timeRange.value = [0, timeRange.value[1] - timeRange.value[0]];
-        } else if (end > duration.value) {
-            // Don't go past the end
-            timeRange.value = [
-                duration.value - (timeRange.value[1] - timeRange.value[0]),
-                duration.value,
-            ];
-        } else {
-            // Normal case - move the window
-            timeRange.value = [start, end];
-        }
-
-        // Update the mouse position for next movement
-        mouseDownStart.value = event.clientX;
-    }
-}
-
-function handleKeyDown(event: KeyboardEvent) {
-    if (event.key === "ArrowLeft") {
-        handleLeftPress(event);
-    } else if (event.key === "ArrowRight") {
-        handleRightPress(event);
-    } else if (event.key === " ") {
-        // Space handling moved here
-        handleSpaceDown(event);
-    }
-}
-
-function handleKeyUp(event: KeyboardEvent) {
-    // Handle key up events
-    if (event.key === " ") {
-        handleSpaceUp(event);
-    }
-}
-
-function handleSpaceDown(event: KeyboardEvent) {
-    event.preventDefault();
-}
-
-function handleSpaceUp(event: KeyboardEvent) {
-    executeCommand(new TogglePlayCommand());
-    event.preventDefault();
-}
-
-const getSkipTime = (event: KeyboardEvent) =>
-    match(event)
-        .with({ shiftKey: true }, () => 30)
-        .with({ ctrlKey: true }, () => 1)
-        .otherwise(() => 5);
-
-function handleLeftPress(event: KeyboardEvent) {
-    const skipTime = getSkipTime(event);
-
-    const newTime = Math.max(0, currentTime.value - skipTime);
-    executeCommand(new SeekToSecondsCommand(newTime));
-    event.preventDefault();
-}
-
-function handleRightPress(event: KeyboardEvent) {
-    const skipTime = getSkipTime(event);
-
-    const newTime = Math.min(duration.value, currentTime.value + skipTime);
-    executeCommand(new SeekToSecondsCommand(newTime));
-    event.preventDefault();
-}
-
-// Watch the current time to ensure it stays within the visible range
-watch(currentTime, (newTime) => {
-    // If current time moves outside the visible range
-    if (newTime < timeRange.value[0] || newTime > timeRange.value[1]) {
-        // Calculate the current view width/duration
-        const rangeWidth = timeRange.value[1] - timeRange.value[0];
-
-        // Determine new start and end positions
-        let newStart: number;
-        let newEnd: number;
-
-        if (newTime < timeRange.value[0]) {
-            // If current time is before visible range, align to left edge
-            newStart = Math.max(0, newTime);
-            newEnd = newStart + rangeWidth;
-        } else {
-            // If current time is after visible range, align to right edge
-            newEnd = Math.min(duration.value, newTime);
-            newStart = Math.max(0, newEnd - rangeWidth);
-        }
-
-        // Update the time range
-        timeRange.value = [newStart, newEnd];
-    }
-});
-</script>
-
-<template>
-    <div class="p-1">
-        <div v-if="audioFile && duration > 0">
-            <div tabindex="0" @keydown="handleKeyDown" @keyup="handleKeyUp">
-                <VideoView v-model="currentTime" :duration="duration" />
-
-                <ClientOnly>
-                    <div @wheel="handleWheel" @mousedown="handleMouseDown" @mouseup="handleMouseUp"
-                        @mousemove="handleMouseMove">
-                        <!-- <AudioSpectrogram
-                            :audio-file="audioFile"
-                            :current-time="currentTime"
-                            :duration="duration"
-                            :zoom-x="zoomX"
-                            :start-time="timeRange[0]"
-                        /> -->
-
-                        <TimelineView :current-time="currentTime" :duration="duration" :zoom-x="zoomX"
-                            :start-time="timeRange[0]" :end-time="timeRange[1]" />
-                    </div>
-                </ClientOnly>
-
-                <USlider v-model="timeRange" :min="0" :max="duration" class="my-2" />
-            </div>
-
-            <CurrentSegementEditor :current-time="currentTime" :duration="duration" class="m-2" />
-            <RenameSpeakerView class="m-2" />
-        </div>
-    </div>
-</template>
diff --git a/app/components/MediaPlaybackBar.vue b/app/components/MediaPlaybackBar.vue
new file mode 100644
index 0000000..1435b8c
--- /dev/null
+++ b/app/components/MediaPlaybackBar.vue
@@ -0,0 +1,233 @@
+<script lang="ts" setup>
+import { Cmds, type SeekToSecondsCommand, type TogglePlayCommand } from "~/types/commands";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import { formatTime } from "~/utils/time";
+
+interface MediaPlaybackBarProps {
+    transcription: StoredTranscription;
+    duration: number;
+}
+
+const props = defineProps<MediaPlaybackBarProps>();
+
+const currentTime = defineModel<number>({ default: 0 });
+
+const isExpanded = ref(false);
+const mediaFile = ref<Blob | null>(null);
+const mediaSrc = ref<string>("");
+const videoElement = ref<HTMLVideoElement | null>(null);
+const audioElement = ref<HTMLAudioElement | null>(null);
+const isPlaying = ref<boolean>(false);
+const isVideoFile = ref<boolean>(false);
+
+const segments = computed(() => props.transcription.segments ?? []);
+
+const { getSpeakerColor } = useSpeakerColor(
+    computed(() => Array.from(getUniqueSpeakers(segments.value))),
+);
+
+const { onCommand } = useCommandBus();
+
+const currentSegments = computed(() => {
+    return segments.value.filter(
+        (segment) =>
+            currentTime.value >= segment.start &&
+            currentTime.value < segment.end,
+    );
+});
+
+onMounted(() => {
+    loadMedia();
+});
+
+onUnmounted(() => {
+    if (mediaSrc.value) {
+        URL.revokeObjectURL(mediaSrc.value);
+    }
+});
+
+onCommand<TogglePlayCommand>(Cmds.TogglePlayCommand, async (_) => {
+    togglePlay();
+});
+
+onCommand<SeekToSecondsCommand>(Cmds.SeekToSecondsCommand, async (cmd) => {
+    seekTo(cmd.seconds);
+});
+
+watch(
+    () => props.transcription,
+    () => {
+        loadMedia();
+    },
+    { immediate: true },
+);
+
+function loadMedia(): void {
+    if (!props.transcription?.mediaFile) {
+        return;
+    }
+
+    if (mediaSrc.value) {
+        URL.revokeObjectURL(mediaSrc.value);
+    }
+
+    mediaFile.value = props.transcription.mediaFile;
+    mediaSrc.value = URL.createObjectURL(mediaFile.value);
+    isVideoFile.value = mediaFile.value.type.startsWith("video/");
+    isPlaying.value = false;
+}
+
+function togglePlay(): void {
+    if (videoElement.value) {
+        if (isPlaying.value) {
+            videoElement.value.pause();
+        } else {
+            videoElement.value.play();
+        }
+    } else if (audioElement.value) {
+        if (isPlaying.value) {
+            audioElement.value.pause();
+        } else {
+            audioElement.value.play();
+        }
+    }
+    isPlaying.value = !isPlaying.value;
+}
+
+function seekTo(time: number): void {
+    if (audioElement.value && audioElement.value.currentTime !== time) {
+        audioElement.value.currentTime = time;
+    } else if (videoElement.value && videoElement.value.currentTime !== time) {
+        videoElement.value.currentTime = time;
+    }
+    currentTime.value = time;
+}
+
+function onTimeUpdate(): void {
+    if (videoElement.value) {
+        currentTime.value = videoElement.value.currentTime;
+    } else if (audioElement.value) {
+        currentTime.value = audioElement.value.currentTime;
+    }
+}
+
+function onSliderChange(value: number | undefined): void {
+    if (value !== undefined) {
+        seekTo(value);
+    }
+}
+
+function toggleExpanded(): void {
+    isExpanded.value = !isExpanded.value;
+}
+</script>
+
+<template>
+    <div id="media-playback-bar" class=" bg-default border-b border-default shadow-sm">
+        <!-- We cannot use v-if here because the video need to exist so it can be played therefore we use v-show -->
+        <div v-show="isExpanded" class="p-2">
+            <div class="media-container" :class="{ 'media-container--audio': !isVideoFile }">
+                <!-- biome-ignore lint/a11y/useMediaCaption: User-uploaded media may not have captions -->
+                <video v-if="isVideoFile && mediaFile" ref="videoElement" class="media-player rounded"
+                    @timeupdate="onTimeUpdate" @click="togglePlay">
+                    <source :src="mediaSrc" :type="mediaFile.type">
+                </video>
+                <audio v-if="!isVideoFile && mediaFile" ref="audioElement" :src="mediaSrc" @timeupdate="onTimeUpdate" />
+
+                <div v-if="!isVideoFile && mediaFile" class="audio-visualization">
+                </div>
+
+                <div class="subtitles-container">
+                    <div v-for="segment in currentSegments" :key="segment.id" class="subtitle-segment" :style="{
+                        '--text-color': getSpeakerColor(segment.speaker ?? 'unknown').toString(),
+                    }">
+                        <span class="font-bold">{{ segment.speaker }}: </span>
+                        <span>{{ segment.text }}</span>
+                    </div>
+                </div>
+            </div>
+
+            <div class="controls flex gap-2 items-center mt-2">
+                <UButton id="media-play-button" size="sm" color="secondary" @click="togglePlay">
+                    <UIcon :name="isPlaying ? 'i-lucide-pause' : 'i-lucide-play'" />
+                </UButton>
+
+                <USlider :model-value="currentTime" color="secondary" :min="0" :max="props.duration" :step="0.1"
+                    class="flex-1" @update:model-value="onSliderChange" />
+
+                <div class="text-sm text-muted-foreground min-w-[100px] text-right">
+                    {{ formatTime(currentTime, { milliseconds: false }) }} /
+                    {{ formatTime(props.duration, { milliseconds: false }) }}
+                </div>
+
+                <UButton id="media-expand-button" size="sm" variant="ghost" @click="toggleExpanded">
+                    <UIcon name="i-lucide-chevron-up" />
+                </UButton>
+            </div>
+        </div>
+
+        <div v-show="!isExpanded" class="flex items-center gap-2 p-2">
+            <UButton size="sm" color="secondary" variant="ghost" @click="togglePlay">
+                <UIcon :name="isPlaying ? 'i-lucide-pause' : 'i-lucide-play'" />
+            </UButton>
+
+            <USlider :model-value="currentTime" color="secondary" :min="0" :max="props.duration" :step="0.1"
+                class="flex-1" @update:model-value="onSliderChange" />
+
+            <div class="text-sm text-muted-foreground min-w-[100px] text-right">
+                {{ formatTime(currentTime, { milliseconds: false }) }} /
+                {{ formatTime(props.duration, { milliseconds: false }) }}
+            </div>
+
+            <UButton id="media-expand-button-collapsed" size="sm" variant="ghost" @click="toggleExpanded">
+                <UIcon name="i-lucide-chevron-down" />
+            </UButton>
+        </div>
+
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.media-container {
+    position: relative;
+    margin: auto;
+    width: fit-content;
+}
+
+.media-container--audio {
+    width: 100%;
+}
+
+.media-player {
+    @apply rounded;
+    display: block;
+    border-radius: 4px;
+    max-height: 300px;
+}
+
+.audio-visualization {
+    @apply bg-muted rounded;
+    display: block;
+    width: 100%;
+    height: 120px;
+}
+
+.subtitles-container {
+    position: absolute;
+    bottom: 0.5rem;
+    left: 0.5rem;
+    right: 0.5rem;
+    display: flex;
+    justify-content: center;
+    background-color: rgba(177, 177, 177, 0.9);
+    border-radius: 4px;
+    padding: 8px 12px;
+    min-height: 30px;
+}
+
+.subtitle-segment {
+    font-size: 16px;
+    color: var(--text-color);
+    -webkit-text-stroke: 0.5px #313131;
+}
+</style>
diff --git a/app/components/MediaPreviewView.vue b/app/components/MediaPreviewView.vue
new file mode 100644
index 0000000..31f2db4
--- /dev/null
+++ b/app/components/MediaPreviewView.vue
@@ -0,0 +1,339 @@
+<script lang="ts" setup>
+import type { SelectMenuItem } from "@nuxt/ui";
+import { motion } from "motion-v";
+import type {
+    MediaConfigureData,
+    MediaSelectionData,
+} from "~/types/mediaStepInOut";
+
+const emit = defineEmits<(e: "onNext", payload: MediaConfigureData) => void>();
+
+const input = defineModel<MediaSelectionData>("input", { required: true });
+
+const { t } = useI18n();
+
+const language = ref<string>("de");
+const numSpeaker = ref<string>("auto");
+
+console.log("MediaPreviewView input:", input.value.media.type);
+
+// Speaker options for the select input
+const speakerOptions = [
+    { label: t("upload.autoDetection"), value: "auto" },
+    { label: "1", value: "1" },
+    { label: "2", value: "2" },
+    { label: "3", value: "3" },
+    { label: "4", value: "4" },
+    { label: "5", value: "5" },
+    { label: "6", value: "6" },
+];
+
+// Language options for the select menu
+const audioLanguageOptions: SelectMenuItem[] = [
+    {
+        label: t("upload.autoDetection"),
+        value: "auto",
+        icon: "i-lucide-languages",
+    },
+    ...languages.map((lang) => ({
+        label: t(`languages.${lang.code}`),
+        value: lang.code,
+        icon: lang.icon,
+    })),
+];
+
+const isVideo = computed(() => isVideoFile(input.value.media));
+const mediaSource = computed(() => URL.createObjectURL(input.value.media));
+
+onUnmounted(() => {
+    URL.revokeObjectURL(mediaSource.value);
+});
+
+function formatFileSize(bytes: number): string {
+    if (bytes === 0) return "0 Bytes";
+    const k = 1024;
+    const sizes = ["Bytes", "KB", "MB", "GB"];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return `${Number.parseFloat((bytes / k ** i).toFixed(2))} ${sizes[i]}`;
+}
+
+function onNext() {
+    const outputData: MediaConfigureData = {
+        media: input.value.media,
+        numSpeaker: numSpeaker.value,
+        language: language.value,
+    };
+    emit("onNext", outputData);
+}
+</script>
+
+<template>
+    <div class="w-full">
+        <div
+            class="flex flex-col lg:flex-row gap-6 lg:gap-8 items-start justify-center max-w-7xl mx-auto p-4 lg:p-6"
+        >
+            <!-- Media Preview Column -->
+            <motion.div
+                :animate="{ opacity: 1, scale: 1, rotateX: 0 }"
+                :initial="{ opacity: 0, scale: 0.95, rotateX: -5 }"
+                :transition="{ duration: 0.6, delay: 0.1, ease: 'easeOut' }"
+                class="w-full lg:w-3/5"
+            >
+                <div
+                    class="relative group rounded-3xl overflow-hidden shadow-2xl shadow-gray-900/10 dark:shadow-black/30 bg-gradient-to-br from-gray-50 to-white dark:from-gray-900 dark:to-gray-800 ring-1 ring-gray-200/50 dark:ring-gray-700/50"
+                >
+                    <!-- Video Preview -->
+                    <div v-if="isVideo" class="space-y-0">
+                        <!-- Video Metadata -->
+                        <div class="flex items-center gap-6 p-6 rounded-t-2xl">
+                            <div class="flex-shrink-0 relative">
+                                <div
+                                    class="absolute inset-0 bg-gradient-to-br from-red-500 to-orange-600 rounded-xl blur-xl opacity-50 group-hover:opacity-75 transition-opacity duration-500"
+                                />
+                                <div
+                                    class="relative w-14 h-14 lg:w-16 lg:h-16 bg-gradient-to-br from-red-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg group-hover:scale-105 transition-transform duration-300"
+                                >
+                                    <UIcon
+                                        name="i-lucide-video"
+                                        class="w-7 h-7 lg:w-8 lg:h-8 text-white"
+                                    />
+                                </div>
+                            </div>
+                            <div class="flex-1 min-w-0">
+                                <h3
+                                    class="text-base lg:text-lg font-semibold text-gray-900 dark:text-white truncate"
+                                >
+                                    {{ input.media.name }}
+                                </h3>
+                                <p
+                                    class="text-sm text-gray-500 dark:text-gray-400 mt-1"
+                                >
+                                    {{ formatFileSize(input.media.size) }}
+                                </p>
+                            </div>
+                        </div>
+                        <!-- Video Player -->
+                        <div
+                            class="aspect-video w-full overflow-hidden shadow-lg rounded-b-2xl"
+                        >
+                            <!-- biome-ignore lint/a11y/useMediaCaption: User-uploaded media may not have captions -->
+                            <video
+                                controls
+                                class="w-full h-full object-contain"
+                                :src="mediaSource"
+                                :type="input.media.type"
+                            >
+                                Your browser does not support the video tag.
+                            </video>
+                        </div>
+                    </div>
+
+                    <!-- Audio Preview -->
+                    <div v-else class="p-8 lg:p-12 space-y-6">
+                        <div class="flex items-center gap-6">
+                            <div class="flex-shrink-0 relative">
+                                <div
+                                    class="absolute inset-0 bg-gradient-to-br from-blue-500 to-purple-600 rounded-2xl blur-xl opacity-50 group-hover:opacity-75 transition-opacity duration-500"
+                                />
+                                <div
+                                    class="relative w-20 h-20 lg:w-24 lg:h-24 bg-gradient-to-br from-blue-500 to-purple-600 rounded-2xl flex items-center justify-center shadow-lg group-hover:scale-105 transition-transform duration-300"
+                                >
+                                    <UIcon
+                                        name="i-lucide-audio-lines"
+                                        class="w-10 h-10 lg:w-12 lg:h-12 text-white"
+                                    />
+                                </div>
+                            </div>
+                            <div class="flex-1 min-w-0">
+                                <h3
+                                    class="text-lg lg:text-xl font-semibold text-gray-900 dark:text-white truncate"
+                                >
+                                    {{ input.media.name }}
+                                </h3>
+                                <p
+                                    class="text-sm text-gray-500 dark:text-gray-400 mt-1"
+                                >
+                                    {{ formatFileSize(input.media.size) }}
+                                </p>
+                            </div>
+                        </div>
+                        <div class="relative">
+                            <!-- biome-ignore lint/a11y/useMediaCaption: User-uploaded media may not have captions -->
+                            <audio
+                                controls
+                                class="w-full h-12 rounded-xl"
+                                :src="mediaSource"
+                                :type="input.media.type"
+                            >
+                                Your browser does not support the audio element.
+                            </audio>
+                        </div>
+                    </div>
+
+                    <!-- Decorative elements -->
+                    <div
+                        class="absolute top-0 right-0 w-32 h-32 bg-gradient-to-bl from-blue-500/10 to-transparent rounded-bl-full pointer-events-none"
+                    />
+                    <div
+                        class="absolute bottom-0 left-0 w-24 h-24 bg-gradient-to-tr from-purple-500/10 to-transparent rounded-tr-full pointer-events-none"
+                    />
+                </div>
+            </motion.div>
+
+            <!-- Settings Column -->
+            <motion.div
+                :animate="{ opacity: 1, x: 0 }"
+                :initial="{ opacity: 0, x: 20 }"
+                :transition="{ duration: 0.6, delay: 0.2, ease: 'easeOut' }"
+                class="w-full lg:w-2/5"
+            >
+                <div class="sticky top-6 space-y-6">
+                    <!-- Card Header -->
+                    <div
+                        class="bg-gradient-to-r from-blue-500 to-purple-600 rounded-2xl p-6 text-white shadow-xl shadow-blue-500/20"
+                    >
+                        <div class="flex items-center gap-3">
+                            <div
+                                class="w-10 h-10 bg-white/20 backdrop-blur-sm rounded-xl flex items-center justify-center"
+                            >
+                                <UIcon
+                                    name="i-lucide-settings-2"
+                                    class="w-5 h-5"
+                                />
+                            </div>
+                            <div>
+                                <h2 class="text-lg font-semibold">
+                                    {{ t("upload.settings") }}
+                                </h2>
+                                <p class="text-sm text-white/80">
+                                    {{ t("upload.configureTranscription") }}
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Settings Card -->
+                    <div
+                        class="bg-white dark:bg-gray-800 rounded-2xl shadow-xl shadow-gray-900/10 dark:shadow-black/20 ring-1 ring-gray-200/50 dark:ring-gray-700/50 p-6 space-y-6"
+                    >
+                        <!-- Number of Speakers -->
+                        <motion.div
+                            :animate="{ opacity: 1, y: 0 }"
+                            :initial="{ opacity: 0, y: 10 }"
+                            :transition="{ duration: 0.4, delay: 0.3 }"
+                        >
+                            <div class="space-y-3">
+                                <div class="flex items-center gap-2">
+                                    <div
+                                        class="w-8 h-8 bg-blue-100 dark:bg-blue-900/30 rounded-lg flex items-center justify-center"
+                                    >
+                                        <UIcon
+                                            name="i-lucide-users"
+                                            class="w-4 h-4 text-blue-600 dark:text-blue-400"
+                                        />
+                                    </div>
+                                    <label
+                                        class="text-sm font-medium text-gray-900 dark:text-white"
+                                    >
+                                        {{ t("upload.numSpeakers") }}
+                                    </label>
+                                </div>
+                                <p
+                                    class="text-xs text-gray-500 dark:text-gray-400 pl-10"
+                                >
+                                    {{ t("upload.numSpeakersHelp") }}
+                                </p>
+                                <USelect
+                                    v-model="numSpeaker"
+                                    :items="speakerOptions"
+                                    placeholder="Select number of speakers"
+                                    size="lg"
+                                    class="w-full"
+                                />
+                            </div>
+                        </motion.div>
+
+                        <div class="h-px bg-gray-200 dark:bg-gray-700" />
+
+                        <!-- Audio Language -->
+                        <motion.div
+                            :animate="{ opacity: 1, y: 0 }"
+                            :initial="{ opacity: 0, y: 10 }"
+                            :transition="{ duration: 0.4, delay: 0.4 }"
+                        >
+                            <div class="space-y-3">
+                                <div class="flex items-center gap-2">
+                                    <div
+                                        class="w-8 h-8 bg-purple-100 dark:bg-purple-900/30 rounded-lg flex items-center justify-center"
+                                    >
+                                        <UIcon
+                                            name="i-lucide-globe"
+                                            class="w-4 h-4 text-purple-600 dark:text-purple-400"
+                                        />
+                                    </div>
+                                    <label
+                                        class="text-sm font-medium text-gray-900 dark:text-white"
+                                    >
+                                        {{ t("upload.audioLanguage") }}
+                                    </label>
+                                </div>
+                                <p
+                                    class="text-xs text-gray-500 dark:text-gray-400 pl-10"
+                                >
+                                    {{ t("upload.audioLanguageHelp") }}
+                                </p>
+                                <USelectMenu
+                                    v-model="language"
+                                    value-key="value"
+                                    :items="audioLanguageOptions"
+                                    size="lg"
+                                    class="w-full"
+                                />
+                            </div>
+                        </motion.div>
+
+                        <!-- Info Box -->
+                        <motion.div
+                            :animate="{ opacity: 1, scale: 1 }"
+                            :initial="{ opacity: 0, scale: 0.95 }"
+                            :transition="{ duration: 0.4, delay: 0.5 }"
+                        >
+                            <div
+                                class="flex items-start gap-3 p-4 bg-gradient-to-r from-blue-50 to-purple-50 dark:from-blue-900/20 dark:to-purple-900/20 rounded-xl border border-blue-100 dark:border-blue-800/30"
+                            >
+                                <UIcon
+                                    name="i-lucide-info"
+                                    class="w-5 h-5 text-blue-600 dark:text-blue-400 flex-shrink-0 mt-0.5"
+                                />
+                                <p
+                                    class="text-xs text-gray-600 dark:text-gray-300 leading-relaxed"
+                                >
+                                    {{ t("upload.settingsInfo") }}
+                                </p>
+                            </div>
+                        </motion.div>
+
+                        <!-- Next Button -->
+                        <motion.div
+                            :animate="{ opacity: 1, y: 0 }"
+                            :initial="{ opacity: 0, y: 10 }"
+                            :transition="{ duration: 0.4, delay: 0.6 }"
+                        >
+                            <UButton
+                                size="lg"
+                                color="primary"
+                                variant="solid"
+                                icon="i-lucide-arrow-right"
+                                trailing
+                                class="w-full"
+                                @click="onNext"
+                            >
+                                {{ t("navigation.new") }}
+                            </UButton>
+                        </motion.div>
+                    </div>
+                </div>
+            </motion.div>
+        </div>
+    </div>
+</template>
diff --git a/app/components/MediaProcessingView.vue b/app/components/MediaProcessingView.vue
new file mode 100644
index 0000000..e1a2e67
--- /dev/null
+++ b/app/components/MediaProcessingView.vue
@@ -0,0 +1,164 @@
+<script lang="ts" setup>
+import { apiFetch, isApiError } from "@dcc-bs/communication.bs.js";
+import { motion } from "motion-v";
+import type { MediaProgress } from "~/types/mediaProgress";
+import type { MediaConfigureData } from "~/types/mediaStepInOut";
+import { type TaskStatus, TaskStatusSchema } from "~/types/task";
+import { isVideoFile } from "~/utils/videoUtils";
+
+const input = defineModel<MediaConfigureData>("input", { required: true });
+
+const errorMessage = ref<string>();
+
+const progressions = ref<[MediaProgress, MediaProgress, MediaProgress]>([
+    {
+        icon: "i-lucide-file",
+        message: "...",
+        progress: 0,
+    },
+    {
+        icon: "i-lucide-upload-cloud",
+        message: "...",
+        progress: 0,
+    },
+    {
+        icon: "i-lucide-cpu",
+        message: "...",
+        progress: 0,
+    },
+]);
+
+const { extractAudioFromVideo } = useAudioExtract();
+const { t } = useI18n();
+const logger = useLogger();
+const { addTask } = useTasks();
+const { pollTaskStatus, applyTaskResult } = useTaskListener();
+
+onMounted(() => {
+    processMedia();
+});
+
+async function processMedia() {
+    const processedFile = await preprocessMedia(progressions.value[0]);
+    const task = await uploadFile(processedFile, progressions.value[1]);
+    await waitForTask(task, progressions.value[2]);
+}
+
+// extract the audio form when video file; else do nothing
+async function preprocessMedia(progress: MediaProgress) {
+    if (isVideoFile(input.value.media)) {
+        const { audioBlob, audioFileName } = await extractAudioFromVideo(
+            input.value.media,
+        );
+
+        const audioFile = new File([audioBlob], audioFileName, {
+            type: audioBlob.type,
+        });
+
+        progress.message = "Extracted Audio form Video";
+        progress.progress = 100;
+
+        return audioFile;
+    }
+
+    progress.message = "audio preprocessed";
+    progress.progress = 100;
+    // on audio do nothin
+    return input.value.media;
+}
+
+async function uploadFile(
+    processedFile: File,
+    progress: MediaProgress,
+): Promise<TaskStatus> {
+    progress.message = t("upload.uploadingMedia");
+    progress.progress = null;
+
+    const formData = new FormData();
+    formData.append("audio_file", processedFile);
+
+    if (input.value.language !== "auto") {
+        formData.append("language", input.value.language);
+    }
+
+    if (input.value.numSpeaker !== "auto") {
+        formData.append("num_speakers", input.value.numSpeaker);
+    }
+
+    const response = await apiFetch("/api/transcribe/submit", {
+        schema: TaskStatusSchema,
+        body: formData,
+        method: "POST",
+    });
+
+    if (isApiError(response)) {
+        logger.error(response, response.debugMessage);
+        errorMessage.value = t(`errors.${response.errorId}`);
+        throw response;
+    }
+
+    progress.progress = 90;
+    await addTask(response, input.value.media, input.value.media.name);
+
+    progress.progress = 100;
+    return response;
+}
+
+async function waitForTask(task: TaskStatus, mediaProgress: MediaProgress) {
+    await pollTaskStatus(
+        task.task_id,
+        // on progress
+        ({ message, progress }) => {
+            mediaProgress.message = message;
+            mediaProgress.progress = progress ?? 0 * 100;
+        },
+        // on complete
+        async (transcription) => {
+            try {
+                await applyTaskResult(
+                    task.task_id,
+                    transcription,
+                    input.value.media,
+                    input.value.media.name,
+                );
+            } catch (e) {
+                logger.error(e, "Failed to finihs the task");
+                errorMessage.value = t(
+                    "task.errors.failedToCreateTranscription",
+                );
+            }
+        },
+    );
+}
+</script>
+
+<template>
+    <div class="flex flex-col items-center justify-center py-12 px-6">
+        <div v-if="!errorMessage">
+            <!-- Media File Card with Upload Animation -->
+            <div class="relative w-full max-w-lg">
+                <MediaProgressView
+                    :media="input.media"
+                    :mediaName="input.media.name"
+                    :progressSteps="progressions"
+                />
+            </div>
+        </div>
+
+        <!-- Error Message Display -->
+        <motion.div
+            v-if="errorMessage"
+            :animate="{ opacity: 1, y: 0 }"
+            :initial="{ opacity: 0, y: 20 }"
+            :transition="{ type: 'spring', stiffness: 200, damping: 20 }"
+            class="mt-8 max-w-md w-full"
+        >
+            <UAlert
+                icon="i-lucide-alert-circle"
+                color="error"
+                title="error"
+                :description="errorMessage"
+            ></UAlert>
+        </motion.div>
+    </div>
+</template>
diff --git a/app/components/MediaProgressView.vue b/app/components/MediaProgressView.vue
new file mode 100644
index 0000000..b51e5ed
--- /dev/null
+++ b/app/components/MediaProgressView.vue
@@ -0,0 +1,92 @@
+<script lang="ts" setup>
+import { motion } from 'motion-v';
+import { getProgress, type MediaProgress } from '~/types/mediaProgress';
+
+interface InputProps {
+    media: File | Blob,
+    mediaName: string,
+    progressSteps: MediaProgress[]
+}
+
+const props = defineProps<InputProps>();
+</script>
+
+<template>
+    <!-- Media File Card with Upload Animation -->
+    <div class="relative w-full max-w-lg">
+        <!-- File Card -->
+        <motion.div :animate="{ opacity: 1, y: 0 }" :initial="{ opacity: 0, y: 20 }" :transition="{
+            type: 'spring',
+            stiffness: 200,
+            damping: 20,
+        }"
+            class="relative bg-white dark:bg-gray-800 rounded-3xl shadow-2xl shadow-gray-900/10 dark:shadow-black/30 ring-1 ring-gray-200/50 dark:ring-gray-700/50 overflow-hidden">
+            <!-- File Header -->
+            <div class="relative px-6 py-4 bg-linear-to-r from-blue-500 to-purple-600">
+                <div class="flex items-center gap-3">
+                    <!-- File Icon -->
+                    <div
+                        class="relative w-12 h-12 bg-white/20 backdrop-blur-sm rounded-xl flex items-center justify-center">
+                        <UIcon :name="isVideoFile(props.media)
+                            ? 'i-lucide-video'
+                            : 'i-lucide-file-audio'
+                            " class="w-6 h-6 text-white" />
+                    </div>
+                    <!-- File Name -->
+                    <div class="flex-1 min-w-0">
+                        <p class="text-white font-semibold truncate">
+                            {{ props.mediaName }}
+                        </p>
+                        <p class="text-white/80 text-xs">
+                            {{
+                                isVideoFile(props.media)
+                                    ? "Video"
+                                    : "Audio"
+                            }}
+                            •
+                            {{
+                                props.media.type
+                                    .split("/")[1]
+                                    ?.toUpperCase()
+                            }}
+                        </p>
+                    </div>
+                    <!-- Status Badge -->
+                    <div class="flex items-center gap-2 px-3 py-1 bg-white/20 backdrop-blur-sm rounded-full">
+                        <div class="w-2 h-2 bg-green-400 rounded-full animate-pulse" />
+                        <span class="text-white text-xs font-medium">
+                            Processing
+                        </span>
+                    </div>
+                </div>
+            </div>
+
+            <!-- File Content Area -->
+            <div class="p-8">
+                <!-- Progress Steps -->
+                <div class="mt-6 space-y-4">
+                    <motion.div v-for="progress in props.progressSteps" :animate="{ opacity: 1, x: 0 }"
+                        :initial="{ opacity: 0, x: -20 }" :transition="{ delay: 0.2, duration: 0.5 }"
+                        class="flex items-center gap-3">
+                        <div
+                            class="w-8 h-8 bg-linear-to-br from-blue-400 to-blue-600 rounded-lg flex items-center justify-center shadow-lg shadow-blue-500/30">
+                            <UIcon :name="progress.icon" class="w-4 h-4 text-white" />
+                        </div>
+                        <div class="flex-1">
+                            <p class="text-sm font-medium text-gray-900 dark:text-white">
+                                {{ progress.message }}
+                            </p>
+                            <UProgress v-model="progress.progress" />
+                        </div>
+                        <div class="flex items-center justify-center">
+                            <UIcon v-if="getProgress(progress) < 100" name="i-lucide-loader-2"
+                                class="w-5 h-5 text-teal-500 animate-spin" />
+                            <UIcon v-if="getProgress(progress) >= 100" name="i-lucide-check-circle-2"
+                                class="w-5 h-5 text-blue-500" />
+                        </div>
+                    </motion.div>
+                </div>
+            </div>
+        </motion.div>
+    </div>
+</template>
diff --git a/app/components/MediaSelectionView.vue b/app/components/MediaSelectionView.vue
new file mode 100644
index 0000000..a08112b
--- /dev/null
+++ b/app/components/MediaSelectionView.vue
@@ -0,0 +1,138 @@
+<script lang="ts" setup>
+import { motion } from "motion-v";
+import type { MediaSelectionData } from "~/types/mediaStepInOut";
+
+const emit =
+    defineEmits<(e: "onMediaSelected", data: MediaSelectionData) => void>();
+
+const { t } = useI18n();
+
+const uploadFile = ref<File>();
+
+watch(uploadFile, () => {
+    if (uploadFile.value) {
+        emit("onMediaSelected", { media: uploadFile.value });
+    }
+});
+
+function onRecodingComplete(audio: Blob) {
+    const file = new File([audio], "recoding.mp3", { type: "audio/mpeg" });
+    emit("onMediaSelected", { media: file });
+}
+</script>
+
+<template>
+    <div class="w-full">
+        <div class="max-w-6xl mx-auto p-6 lg:p-8">
+            <!-- Two Column Layout -->
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 lg:gap-8">
+                <!-- Upload Section -->
+                <motion.div
+                    :animate="{ opacity: 1, x: 0 }"
+                    :initial="{ opacity: 0, x: -20 }"
+                    :transition="{ duration: 0.6, delay: 0.2 }"
+                >
+                    <div
+                        class="rounded-3xl p-8 shadow-xl shadow-gray-900/10 ring-1 ring-gray-200/50 h-full flex flex-col"
+                    >
+                        <!-- Icon Header -->
+                        <div class="flex items-center gap-4 mb-6">
+                            <div
+                                class="w-14 h-14 bg-secondary-500 text-white backdrop-blur-sm rounded-2xl flex items-center justify-center"
+                            >
+                                <UIcon name="i-lucide-upload" class="w-7 h-7" />
+                            </div>
+                            <div>
+                                <h2 class="text-xl font-semibold">
+                                    {{ t("pages.index.uploadMedia") }}
+                                </h2>
+                                <p
+                                    class="text-sm text-gray-500 dark:text-gray-40 mt-1"
+                                >
+                                    {{ t("pages.index.uploadDescription") }}
+                                </p>
+                            </div>
+                        </div>
+
+                        <!-- Upload Card Content -->
+                        <div
+                            class="flex-1 backdrop-blur-sm rounded-2xl flex items-center justify-center min-h-[200px]"
+                        >
+                            <UFileUpload
+                                accept="audio/*, video/*"
+                                icon="i-lucide-file-up"
+                                v-model="uploadFile"
+                                class="w-full h-full rounded"
+                                :ui="{
+                                    base: 'bg-secondary-50',
+                                }"
+                            />
+                        </div>
+
+                        <!-- File Types Info -->
+                        <div
+                            class="mt-6 flex items-start gap-3 text-sm text-white/80"
+                        >
+                            <UIcon
+                                name="i-lucide-info"
+                                class="w-5 h-5 shrink-0 mt-0.5"
+                            />
+                            <div>
+                                <p class="font-medium mb-1">
+                                    Supported formats
+                                </p>
+                                <p class="text-xs text-white/70">
+                                    MP3, MP4, M4A, FLAC, WAV, WEBM
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </motion.div>
+
+                <!-- Recording Section -->
+                <motion.div
+                    :animate="{ opacity: 1, x: 0 }"
+                    :initial="{ opacity: 0, x: 20 }"
+                    :transition="{ duration: 0.6, delay: 0.3 }"
+                >
+                    <div
+                        class="rounded-3xl p-8 shadow-xl shadow-gray-900/10 ring-1 ring-gray-200/50 h-full flex flex-col"
+                    >
+                        <!-- Icon Header -->
+                        <div class="flex items-center gap-4 mb-6">
+                            <div
+                                class="w-14 h-14 bg-gradient-to-br from-red-500 to-orange-600 rounded-2xl flex items-center justify-center shadow-lg"
+                            >
+                                <UIcon
+                                    name="i-lucide-mic"
+                                    class="w-7 h-7 text-white"
+                                />
+                            </div>
+                            <div>
+                                <h2
+                                    class="text-xl font-semibold text-gray-900 dark:text-white"
+                                >
+                                    {{ t("pages.index.recordAudio") }}
+                                </h2>
+                                <p
+                                    class="text-sm text-gray-500 dark:text-gray-400 mt-1"
+                                >
+                                    {{ t("pages.index.recordDescription") }}
+                                </p>
+                            </div>
+                        </div>
+
+                        <!-- Recording Card Content -->
+                        <div
+                            class="rounded p-6 flex items-center justify-center min-h-[200px]"
+                        >
+                            <AudioRecordingView
+                                @on-recording-complete="onRecodingComplete"
+                            />
+                        </div>
+                    </div>
+                </motion.div>
+            </div>
+        </div>
+    </div>
+</template>
diff --git a/app/components/NavigationMenu.vue b/app/components/NavigationMenu.vue
index 17e3796..1ea34a1 100644
--- a/app/components/NavigationMenu.vue
+++ b/app/components/NavigationMenu.vue
@@ -1,138 +1,23 @@
-<script lang="ts" setup>
-import type { NavigationMenuItem } from "@nuxt/ui";
-
-// Add translation hook
-const { t } = useI18n();
-const route = useRoute();
-
-// Using a computed to reactively access the current path
-const currentPath = computed<string>(() => route.path);
-const { canRedo, canUndo, redo, undo, undoStack } = useCommandHistory();
-
-const { availableLocales } = useI18n();
-const switchLocalePath = useSwitchLocalePath();
-
-/**
- * Check if current path is a transcription path
- * Uses the reactive route path for better reactivity
- */
-const isTranscriptionPath = computed<boolean>(() => {
-    return currentPath.value.includes("transcription/");
-});
-
-// Navigation menu items
-const items = computed<NavigationMenuItem[][]>(() => [
-    isTranscriptionPath.value
-        ? [
-            {
-                slot: "disclaimer",
-                as: "link",
-            },
-            {
-                label: t("navigation.undo"),
-                icon: "i-lucide-undo",
-                onSelect: () => handleUndo(),
-                disabled: !canUndo.value,
-            },
-            {
-                label: t("navigation.redo"),
-                icon: "i-lucide-redo",
-                onSelect: handleRedo,
-                disabled: !canRedo.value,
-            },
-        ]
-        : [
-            {
-                slot: "disclaimer",
-                as: "link",
-            },
-        ],
-    [
-        {
-            label: t("navigation.new"),
-            to: "/",
-            icon: "i-lucide-plus",
-        },
-        {
-            label: t("navigation.transcriptions"),
-            to: "/transcription",
-            icon: "i-lucide-queue-list",
-        },
-    ],
-    [
-        {
-            label: t("navigation.languages"),
-            icon: "i-heroicons-language",
-            children: availableLocales.map((locale) => ({
-                label: t(`navigation.${locale}`),
-                to: switchLocalePath(locale),
-            })),
-        },
-    ],
-]);
-
-/**
- * Handler for undo button click
- */
-function handleUndo(amount = 1): void {
-    for (let i = 0; i < amount; i++) {
-        undo();
-    }
-}
-
-function handleRedo(): void {
-    redo();
-}
-</script>
-
 <template>
     <div>
-
-        <!-- [
-            {
-                label: t("navigation.new"),
-                to: "/",
-                icon: "i-heroicons-plus",
-            },
-            {
-                label: t("navigation.transcriptions"),
-                to: "/transcription",
-                icon: "i-heroicons-queue-list",
-            },
-        ], -->
-
         <NavigationBar>
             <template #center>
-                <div class="flex items-end justify-between w-full">
-                    <div v-if="isTranscriptionPath" class="flex gap-2 ml-8">
-                        <UButton icon="i-lucide-undo" @click="() => handleUndo()" :disabled="!canUndo" variant="link">
-                            {{ t('navigation.undo') }}
-                        </UButton>
-                        <UButton icon="i-lucide-redo" @click="handleRedo" :disabled="!canRedo" variant="link">
-                            {{ t('navigation.redo') }}
-                        </UButton>
-                    </div>
-                    <div v-else class="flex-1"></div>
-                    <div class="flex gap-2 absolute left-1/2 transform -translate-x-1/2">
-                        <UButton icon="i-lucide-plus" to="/" variant="link">
-                            {{ t('navigation.new') }}
-                        </UButton>
-                        <UButton icon="i-lucide-list-music" to="/transcription" variant="link">
-                            {{ t('navigation.transcriptions') }}
-                        </UButton>
-                    </div>
-                </div>
+                <slot name="center" />
+            </template>
+            <template #rightPreItems>
+                <slot name="rightPreItems" />
             </template>
         </NavigationBar>
-
         <!-- <ClientOnly>
             <UNavigationMenu content-orientation="vertical" variant="link" :items="items"
                 class="w-full grid grid-cols-3 items-center z-50 [&>*:nth-child(1)]:justify-self-start [&>*:nth-child(2)]:justify-self-center [&>*:nth-child(3)]:justify-self-end">
                 <template #disclaimer>
                     <DisclaimerButton variant="ghost" />
                 </template>
-            </UNavigationMenu>
-
-        </ClientOnly> -->
+</UNavigationMenu>
+<template #fallback>
+                <div class="w-full h-12 bg-gray-100 animate-pulse rounded"></div>
+            </template>
+</ClientOnly> -->
     </div>
 </template>
diff --git a/app/components/Onboarding.vue b/app/components/Onboarding.vue
new file mode 100644
index 0000000..a73998d
--- /dev/null
+++ b/app/components/Onboarding.vue
@@ -0,0 +1,258 @@
+<script setup lang="ts">
+import { type Driver, driver } from "driver.js";
+import "driver.js/dist/driver.css";
+import { useMediaQuery } from "@vueuse/core";
+import {
+    ChangeEditorModeCommand,
+    Cmds,
+    type ShowOnboardingCommand,
+} from "~/types/commands";
+
+const emit = defineEmits<{
+    start: [];
+    complete: [];
+}>();
+
+const { t } = useI18n();
+const { executeCommand, onCommand } = useCommandBus();
+
+const ONBOARDING_KEY = "transcribo-onboarding-completed";
+const isMobile = useMediaQuery("(max-width: 768px)");
+
+async function switchToMode(mode: "view" | "summary" | "edit" | "statistics") {
+    await executeCommand(new ChangeEditorModeCommand(mode));
+}
+
+function getSelector(baseId: string): string {
+    return isMobile.value ? `#mobile-${baseId}` : `#desktop-${baseId}`;
+}
+
+function createDriver() {
+    return driver({
+        showProgress: true,
+        nextBtnText: t("onboarding.next"),
+        prevBtnText: t("onboarding.previous"),
+        doneBtnText: t("onboarding.done"),
+        progressText: t("onboarding.progress"),
+        onDestroyStarted: () => {
+            localStorage.setItem(ONBOARDING_KEY, "true");
+            emit("complete");
+            driverObj.value?.destroy();
+        },
+        steps: [
+            {
+                popover: {
+                    title: t("onboarding.welcome.title"),
+                    description: t("onboarding.welcome.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: "#transcription-info-button",
+                popover: {
+                    title: t("onboarding.transcriptionInfo.title"),
+                    description: t("onboarding.transcriptionInfo.description"),
+                    side: "bottom",
+                    align: "start",
+                },
+            },
+            {
+                element: "#export-toolbar",
+                popover: {
+                    title: t("onboarding.exportToolbar.title"),
+                    description: t("onboarding.exportToolbar.description"),
+                    side: "bottom",
+                    align: "end",
+                },
+            },
+            {
+                element: getSelector("editor-mode-selector"),
+                popover: {
+                    title: t("onboarding.modes.title"),
+                    description: t("onboarding.modes.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: getSelector("mode-view"),
+                popover: {
+                    title: t("onboarding.viewerIntro.title"),
+                    description: t("onboarding.viewerIntro.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: "#viewer-display-options",
+                onHighlightStarted: () => switchToMode("view"),
+                popover: {
+                    title: t("onboarding.viewerDisplayOptions.title"),
+                    description: t(
+                        "onboarding.viewerDisplayOptions.description",
+                    ),
+                    side: "bottom",
+                    align: "start",
+                },
+            },
+            {
+                element: getSelector("mode-summary"),
+                onHighlightStarted: async () => await switchToMode("summary"),
+                popover: {
+                    title: t("onboarding.summary.title"),
+                    description: t("onboarding.summary.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: "#generate-summary-button",
+                popover: {
+                    title: t("onboarding.generateSummary.title"),
+                    description: t("onboarding.generateSummary.description"),
+                    side: "bottom",
+                    align: "start",
+                },
+            },
+            {
+                element: getSelector("mode-edit"),
+                onHighlightStarted: () => switchToMode("edit"),
+                popover: {
+                    onPrevClick: async () => {
+                        switchToMode("summary");
+                        driverObj.value?.movePrevious();
+                    },
+                    title: t("onboarding.editor.title"),
+                    description: t("onboarding.editor.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: "#speaker-names-section",
+                popover: {
+                    title: t("onboarding.speakerNames.title"),
+                    description: t("onboarding.speakerNames.description"),
+                    side: "bottom",
+                    align: "start",
+                },
+            },
+            {
+                element: "#transcription-segments",
+                popover: {
+                    title: t("onboarding.editTranscriptions.title"),
+                    description: t("onboarding.editTranscriptions.description"),
+                    side: "top",
+                    align: "start",
+                },
+            },
+            {
+                element: "#add-transcription-top",
+                popover: {
+                    title: t("onboarding.addTranscription.title"),
+                    description: t("onboarding.addTranscription.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: "#media-playback-bar",
+                popover: {
+                    title: t("onboarding.mediaPlayback.title"),
+                    description: t("onboarding.mediaPlayback.description"),
+                    side: "bottom",
+                    align: "start",
+                },
+            },
+            {
+                element: "#media-expand-button-collapsed",
+                popover: {
+                    title: t("onboarding.mediaExpand.title"),
+                    description: t("onboarding.mediaExpand.description"),
+                    side: "bottom",
+                    align: "start",
+                },
+            },
+            {
+                element: getSelector("mode-statistics"),
+                onHighlightStarted: () => switchToMode("statistics"),
+                popover: {
+                    onPrevClick: async () => {
+                        await switchToMode("edit");
+                        driverObj.value?.movePrevious();
+                    },
+                    title: t("onboarding.statistics.title"),
+                    description: t("onboarding.statistics.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                element: "#speaker-statistics",
+                popover: {
+                    title: t("onboarding.speakerStatistics.title"),
+                    description: t("onboarding.speakerStatistics.description"),
+                    side: "left",
+                    align: "start",
+                },
+            },
+            {
+                element: "#help-button",
+                popover: {
+                    title: t("onboarding.helpButton.title"),
+                    description: t("onboarding.helpButton.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+            {
+                popover: {
+                    title: t("onboarding.complete.title"),
+                    description: t("onboarding.complete.description"),
+                    side: "bottom",
+                    align: "center",
+                },
+            },
+        ],
+    });
+}
+
+const driverObj = ref<Driver>();
+
+function start(): void {
+    driverObj.value = createDriver();
+    emit("start");
+    switchToMode("view");
+    driverObj.value?.drive();
+}
+
+function isCompleted(): boolean {
+    return localStorage.getItem(ONBOARDING_KEY) === "true";
+}
+
+function reset(): void {
+    localStorage.removeItem(ONBOARDING_KEY);
+}
+
+defineExpose({
+    start,
+    isCompleted,
+    reset,
+});
+
+onMounted(() => {
+    if (!isCompleted()) {
+        start();
+    }
+});
+
+onCommand<ShowOnboardingCommand>(Cmds.ShowOnboardingCommand, async () => {
+    if (isCompleted()) {
+        reset();
+    }
+    start();
+});
+</script>
+
+<template></template>
diff --git a/app/components/RenameSpeakerView.vue b/app/components/RenameSpeakerView.vue
index f826871..6aac8cb 100644
--- a/app/components/RenameSpeakerView.vue
+++ b/app/components/RenameSpeakerView.vue
@@ -1,21 +1,24 @@
 <script lang="ts" setup>
 import { UInput } from "#components";
 import { RenameSpeakerCommand } from "~/types/commands";
+import type { StoredTranscription } from "~/types/storedTranscription";
 
-// Get speakers from the current transcription
-const { speakers } = useCurrentTranscription();
+interface InputProps {
+    transcription: StoredTranscription;
+}
+
+const props = defineProps<InputProps>();
+
+const speakers = computed(() =>
+    Array.from(getUniqueSpeakers(props.transcription.segments)),
+);
 const { executeCommand } = useCommandBus();
 const { getSpeakerColor } = useSpeakerColor(speakers);
 
 const { t } = useI18n();
 
-// Create a mapping of original speaker names to their new names
-// This allows us to track both the original name and the edited name
 const speakerMappings = ref<{ original: string; new: string }[]>([]);
 
-/**
- * Initialize speaker mappings when speakers change
- */
 watch(
     speakers,
     () => {
@@ -27,43 +30,34 @@ watch(
     { immediate: true },
 );
 
-/**
- * Handle speaker name change
- * @param originalName - The original speaker name
- * @param newName - The updated speaker name
- */
 function handleSpeakerNameChange(originalName: string, newName: string): void {
-    // Don't execute command if the name hasn't actually changed
     if (originalName === newName) {
         return;
     }
 
-    // Execute the rename speaker command
     executeCommand(new RenameSpeakerCommand(originalName, newName));
 }
 </script>
 
 <template>
-    <UCard>
-        <h2 class="text-lg font-bold">{{ t("common.speakers") }}</h2>
-        <div class="flex gap-2 flex-wrap mt-2">
+    <div id="speaker-names-section" class="bg-muted/50 rounded-lg p-3">
+        <h3 class="text-sm font-semibold mb-2 text-muted-foreground">
+            {{ t("common.speakers") }}
+        </h3>
+        <div class="flex gap-2 flex-wrap">
             <div
                 v-for="(speakerMap, index) in speakerMappings"
                 :key="index"
-                class="speaker-item"
             >
                 <UInput
                     v-model="speakerMap.new"
+                    size="sm"
                     :style="{ color: getSpeakerColor(speakerMap.original) }"
-                    placeholder="Speaker name"
-                    @change="
-                        handleSpeakerNameChange(
-                            speakerMap.original,
-                            speakerMap.new,
-                        )
-                    "
+                    :placeholder="t('transcription.placeholderSpeakerName')"
+                    class="w-32"
+                    @change="handleSpeakerNameChange(speakerMap.original, speakerMap.new)"
                 />
             </div>
         </div>
-    </UCard>
+    </div>
 </template>
diff --git a/app/components/SpeakerStatisticsView.vue b/app/components/SpeakerStatisticsView.vue
new file mode 100644
index 0000000..9695c58
--- /dev/null
+++ b/app/components/SpeakerStatisticsView.vue
@@ -0,0 +1,187 @@
+<script lang="ts" setup>
+import { motion } from "motion-v";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import { computeSpeakerStatistics, formatDuration } from "~/utils/speakerStatistics";
+
+interface InputProps {
+    transcription: StoredTranscription;
+}
+
+const props = defineProps<InputProps>();
+
+const { t } = useI18n();
+
+const mediaDuration = ref<number>(0);
+const isLoadingDuration = ref(true);
+
+const statistics = computed(() => computeSpeakerStatistics(props.transcription.segments));
+
+const totalSpeakingTime = computed(() => 
+    statistics.value.reduce((sum, s) => sum + s.duration, 0)
+);
+
+const speakers = computed(() => statistics.value.map((s) => s.speaker));
+
+const { getSpeakerColor } = useSpeakerColor(speakers);
+
+const speakingPercentage = computed(() => {
+    if (mediaDuration.value <= 0) return 0;
+    return (totalSpeakingTime.value / mediaDuration.value) * 100;
+});
+
+function getSpeakerColorStyle(speaker: string): string {
+    const color = getSpeakerColor(speaker);
+    return `rgb(${Math.round(color.r)}, ${Math.round(color.g)}, ${Math.round(color.b)})`;
+}
+
+onMounted(() => {
+    if (!props.transcription.mediaFile) {
+        const lastSegment = props.transcription.segments[props.transcription.segments.length - 1];
+        mediaDuration.value = lastSegment?.end ?? 0;
+        isLoadingDuration.value = false;
+        return;
+    }
+
+    const audioSrc = URL.createObjectURL(props.transcription.mediaFile);
+    const audio = new Audio();
+    audio.src = audioSrc;
+
+    audio.onloadedmetadata = () => {
+        mediaDuration.value = audio.duration;
+        isLoadingDuration.value = false;
+        URL.revokeObjectURL(audioSrc);
+        audio.onloadedmetadata = null;
+    };
+
+    audio.onerror = () => {
+        const lastSegment = props.transcription.segments[props.transcription.segments.length - 1];
+        mediaDuration.value = lastSegment?.end ?? 0;
+        isLoadingDuration.value = false;
+        URL.revokeObjectURL(audioSrc);
+    };
+});
+</script>
+
+<template>
+    <div id="speaker-statistics" class="grow h-full flex flex-col">
+        <div class="p-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800">
+            <h3 class="font-medium text-sm">
+                {{ t("statistics.title", "Speaker Statistics") }}
+            </h3>
+            <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
+                {{ t("statistics.description", "Speaking time distribution by speaker") }}
+            </p>
+        </div>
+
+        <div class="flex-1 p-4 overflow-auto">
+            <motion.div
+                v-if="statistics.length > 0"
+                class="space-y-4"
+                :initial="{ opacity: 0 }"
+                :animate="{ opacity: 1 }"
+                :transition="{ duration: 0.3 }"
+            >
+                <motion.div
+                    class="grid grid-cols-3 gap-3"
+                    :initial="{ opacity: 0, y: -10 }"
+                    :animate="{ opacity: 1, y: 0 }"
+                    :transition="{ duration: 0.3 }"
+                >
+                    <div class="p-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900">
+                        <div class="text-xs text-gray-500 dark:text-gray-400 mb-1">
+                            {{ t("statistics.audioDuration", "Audio Duration") }}
+                        </div>
+                        <div class="font-mono text-lg font-semibold">
+                            <template v-if="isLoadingDuration">
+                                <span class="text-gray-400">...</span>
+                            </template>
+                            <template v-else>
+                                {{ formatDuration(mediaDuration) }}
+                            </template>
+                        </div>
+                    </div>
+
+                    <div class="p-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900">
+                        <div class="text-xs text-gray-500 dark:text-gray-400 mb-1">
+                            {{ t("statistics.speakingTime", "Speaking Time") }}
+                        </div>
+                        <div class="font-mono text-lg font-semibold">
+                            {{ formatDuration(totalSpeakingTime) }}
+                        </div>
+                    </div>
+
+                    <div class="p-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900">
+                        <div class="text-xs text-gray-500 dark:text-gray-400 mb-1">
+                            {{ t("statistics.speakingPercentage", "Speech Ratio") }}
+                        </div>
+                        <div class="font-mono text-lg font-semibold">
+                            <template v-if="isLoadingDuration">
+                                <span class="text-gray-400">...</span>
+                            </template>
+                            <template v-else>
+                                {{ speakingPercentage.toFixed(1) }}%
+                            </template>
+                        </div>
+                    </div>
+                </motion.div>
+
+                <div class="border-t border-gray-200 dark:border-gray-700 pt-4">
+                    <h4 class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">
+                        {{ t("statistics.bySpeaker", "By Speaker") }}
+                    </h4>
+
+                    <div class="space-y-2">
+                        <motion.div
+                            v-for="(stat, index) in statistics"
+                            :key="stat.speaker"
+                            class="flex items-center gap-4 p-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900"
+                            :initial="{ opacity: 0, x: -20 }"
+                            :animate="{ opacity: 1, x: 0 }"
+                            :transition="{ duration: 0.3, delay: index * 0.05 }"
+                        >
+                            <div
+                                class="w-3 h-3 rounded-full shrink-0"
+                                :style="{ backgroundColor: getSpeakerColorStyle(stat.speaker) }"
+                            />
+
+                            <div class="flex-1 min-w-0">
+                                <div class="font-medium text-sm truncate">
+                                    {{ stat.speaker }}
+                                </div>
+                            </div>
+
+                            <div class="text-right shrink-0">
+                                <div class="font-mono text-sm font-medium">
+                                    {{ formatDuration(stat.duration) }}
+                                </div>
+                                <div class="text-xs text-gray-500 dark:text-gray-400">
+                                    {{ stat.percentage.toFixed(1) }}%
+                                </div>
+                            </div>
+
+                            <div class="w-20 shrink-0">
+                                <div class="h-1.5 bg-gray-200 dark:bg-gray-700 rounded-full overflow-hidden">
+                                    <motion.div
+                                        class="h-full rounded-full"
+                                        :style="{ backgroundColor: getSpeakerColorStyle(stat.speaker) }"
+                                        :initial="{ width: 0 }"
+                                        :animate="{ width: `${stat.percentage}%` }"
+                                        :transition="{ duration: 0.5, delay: index * 0.05 + 0.2 }"
+                                    />
+                                </div>
+                            </div>
+                        </motion.div>
+                    </div>
+                </div>
+            </motion.div>
+
+            <div
+                v-else
+                class="flex flex-col items-center justify-center h-full text-gray-500 dark:text-gray-400"
+            >
+                <UIcon name="i-lucide-users" class="w-12 h-12 mb-2 opacity-50" />
+                <p>{{ t("statistics.noData", "No speaker data available") }}</p>
+            </div>
+        </div>
+    </div>
+</template>
diff --git a/app/components/TimelineEditor.vue b/app/components/TimelineEditor.vue
new file mode 100644
index 0000000..f28722a
--- /dev/null
+++ b/app/components/TimelineEditor.vue
@@ -0,0 +1,194 @@
+<script lang="ts" setup>
+import { match } from "ts-pattern";
+import { SeekToSecondsCommand } from "~/types/commands";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import TimelineView from "./media/TimelineView.client.vue";
+
+interface InputProps {
+    transcription: StoredTranscription;
+    currentTime: number;
+}
+
+const props = defineProps<InputProps>();
+
+const duration = ref<number>(0);
+const timeRange = ref<[number, number]>([0, 0]);
+
+const zoomX = computed(
+    () => duration.value / (timeRange.value[1] - timeRange.value[0]),
+);
+
+const { executeCommand } = useCommandBus();
+
+onMounted(() => {
+    initializeDuration();
+});
+
+watch(
+    () => props.transcription,
+    () => {
+        initializeDuration();
+    },
+);
+
+function initializeDuration(): void {
+    const currentTranscription = props.transcription;
+
+    if (!currentTranscription?.mediaFile) {
+        return;
+    }
+
+    const audioSrc = URL.createObjectURL(currentTranscription.mediaFile);
+    const audio = new Audio();
+    audio.src = audioSrc;
+
+    audio.onloadedmetadata = () => {
+        duration.value = audio.duration;
+        timeRange.value = [0, audio.duration];
+        URL.revokeObjectURL(audioSrc);
+        audio.onloadedmetadata = null;
+    };
+}
+
+function handleWheel(event: WheelEvent): void {
+    const delta = event.deltaY * -0.1;
+
+    const target = event.target as HTMLElement;
+    const w = target.clientWidth;
+    const x = event.offsetX;
+
+    const startFactor = x / w;
+    const endFactor = 1 - startFactor;
+
+    const start = timeRange.value[0] + delta * startFactor;
+    const end = timeRange.value[1] - delta * endFactor;
+
+    event.preventDefault();
+
+    if (end <= start + 0.01) {
+        return;
+    }
+
+    timeRange.value[0] = Math.max(0, start);
+    timeRange.value[1] = Math.min(duration.value, end);
+}
+
+const mouseDownStart = ref<number>();
+
+function handleMouseDown(event: MouseEvent): void {
+    if (event.ctrlKey) {
+        mouseDownStart.value = event.clientX;
+        event.preventDefault();
+        event.stopPropagation();
+    }
+}
+
+function handleMouseUp(_: MouseEvent): void {
+    mouseDownStart.value = undefined;
+}
+
+function handleMouseMove(event: MouseEvent): void {
+    if (mouseDownStart.value !== undefined) {
+        const pixelDelta = event.clientX - mouseDownStart.value;
+        const timeDelta = -pixelDelta / zoomX.value;
+
+        const start = timeRange.value[0] + timeDelta;
+        const end = timeRange.value[1] + timeDelta;
+
+        if (start < 0) {
+            timeRange.value = [0, timeRange.value[1] - timeRange.value[0]];
+        } else if (end > duration.value) {
+            timeRange.value = [
+                duration.value - (timeRange.value[1] - timeRange.value[0]),
+                duration.value,
+            ];
+        } else {
+            timeRange.value = [start, end];
+        }
+
+        mouseDownStart.value = event.clientX;
+    }
+}
+
+function handleKeyDown(event: KeyboardEvent): void {
+    if (event.key === "ArrowLeft") {
+        handleLeftPress(event);
+    } else if (event.key === "ArrowRight") {
+        handleRightPress(event);
+    }
+}
+
+const getSkipTime = (event: KeyboardEvent) =>
+    match(event)
+        .with({ shiftKey: true }, () => 30)
+        .with({ ctrlKey: true }, () => 1)
+        .otherwise(() => 5);
+
+function handleLeftPress(event: KeyboardEvent): void {
+    const skipTime = getSkipTime(event);
+    const newTime = Math.max(0, props.currentTime - skipTime);
+    executeCommand(new SeekToSecondsCommand(newTime));
+    event.preventDefault();
+}
+
+function handleRightPress(event: KeyboardEvent): void {
+    const skipTime = getSkipTime(event);
+    const newTime = Math.min(duration.value, props.currentTime + skipTime);
+    executeCommand(new SeekToSecondsCommand(newTime));
+    event.preventDefault();
+}
+
+watch(
+    () => props.currentTime,
+    (newTime) => {
+        if (newTime < timeRange.value[0] || newTime > timeRange.value[1]) {
+            const rangeWidth = timeRange.value[1] - timeRange.value[0];
+
+            let newStart: number;
+            let newEnd: number;
+
+            if (newTime < timeRange.value[0]) {
+                newStart = Math.max(0, newTime);
+                newEnd = newStart + rangeWidth;
+            } else {
+                newEnd = Math.min(duration.value, newTime);
+                newStart = Math.max(0, newEnd - rangeWidth);
+            }
+
+            timeRange.value = [newStart, newEnd];
+        }
+    },
+);
+</script>
+
+<template>
+    <div class="h-full flex flex-col">
+        <div v-if="duration > 0" class="flex-1 flex flex-col min-h-0" tabindex="0" @keydown="handleKeyDown">
+            <div class="px-2 pt-2 pb-1 shrink-0">
+                <USlider v-model="timeRange" :min="0" :max="duration" />
+            </div>
+
+            <ClientOnly>
+                <div
+                    class="flex-1 min-h-0"
+                    @wheel="handleWheel"
+                    @mousedown="handleMouseDown"
+                    @mouseup="handleMouseUp"
+                    @mousemove="handleMouseMove"
+                >
+                    <TimelineView
+                        :transcription="props.transcription"
+                        :current-time="props.currentTime"
+                        :duration="duration"
+                        :zoom-x="zoomX"
+                        :start-time="timeRange[0]"
+                        :end-time="timeRange[1]"
+                    />
+                </div>
+            </ClientOnly>
+        </div>
+        <div v-else class="flex items-center justify-center h-full text-muted-foreground">
+            Loading timeline...
+        </div>
+    </div>
+</template>
diff --git a/app/components/TranscriptionEditView.vue b/app/components/TranscriptionEditView.vue
new file mode 100644
index 0000000..206c45a
--- /dev/null
+++ b/app/components/TranscriptionEditView.vue
@@ -0,0 +1,127 @@
+<script lang="ts" setup>
+import { useMediaQuery } from "@vueuse/core";
+import { motion } from "motion-v";
+import type { StoredTranscription } from "~/types/storedTranscription";
+
+interface InputProps {
+    transcription: StoredTranscription;
+}
+
+const props = defineProps<InputProps>();
+
+const isMobile = useMediaQuery("(max-width: 800px)");
+const { canUndo, canRedo, undo, redo } = useCommandHistory();
+
+const currentTime = ref(0);
+const duration = ref(0);
+const autoScrollEnabled = ref(true);
+
+onMounted(() => {
+    initializeDuration();
+});
+
+watch(
+    () => props.transcription,
+    () => {
+        initializeDuration();
+        currentTime.value = 0;
+    },
+);
+
+function initializeDuration(): void {
+    if (!props.transcription?.mediaFile) {
+        duration.value = 0;
+        return;
+    }
+
+    const audioSrc = URL.createObjectURL(props.transcription.mediaFile);
+    const audio = new Audio();
+    audio.src = audioSrc;
+
+    audio.onloadedmetadata = () => {
+        duration.value = audio.duration;
+        URL.revokeObjectURL(audioSrc);
+        audio.onloadedmetadata = null;
+    };
+}
+</script>
+
+<template>
+    <div class="relative h-full flex flex-col">
+        <div class="sticky top-0 z-40 bg-default/50 backdrop-blur-sm rounded">
+            <MediaPlaybackBar
+                v-model="currentTime"
+                :transcription="props.transcription"
+                :duration="duration"
+            />
+
+            <div>
+                <!-- <TimelineEditor
+                    :transcription="props.transcription"
+                    :currentTime="currentTime"
+                /> -->
+                <div class="flex justify-between">
+                    <UndoRedoButtons
+                        :canRedo="canRedo"
+                        :canUndo="canUndo"
+                        @redo="redo"
+                        @undo="undo"
+                    />
+                    <UButton
+                        size="xs"
+                        variant="link"
+                        :color="autoScrollEnabled ? 'primary' : 'neutral'"
+                        @click="autoScrollEnabled = !autoScrollEnabled"
+                    >
+                        <template #leading>
+                            <UIcon
+                                :name="
+                                    autoScrollEnabled
+                                        ? 'i-lucide-arrow-down-narrow-wide'
+                                        : 'i-lucide-arrow-down-narrow-wide'
+                                "
+                                :class="{ 'opacity-50': !autoScrollEnabled }"
+                            />
+                        </template>
+                        <span class="text-xs">{{
+                            autoScrollEnabled
+                                ? $t("transcription.autoScrollOn")
+                                : $t("transcription.autoScrollOff")
+                        }}</span>
+                    </UButton>
+                </div>
+            </div>
+        </div>
+
+        <div class="flex-1 min-h-0 flex flex-col">
+            <template v-if="!isMobile">
+                <div class="p-4 flex flex-col gap-4">
+                    <RenameSpeakerView :transcription="props.transcription" />
+                    <TranscriptionList
+                        id="edit-transcription-list"
+                        :transcription="props.transcription"
+                        :currentTime="currentTime"
+                        :autoScrollEnabled="autoScrollEnabled"
+                    />
+                </div>
+            </template>
+
+            <template v-else>
+                <div class="flex-1 min-h-0">
+                    <div class="p-4 flex flex-col gap-4">
+                        <RenameSpeakerView
+                            id="edit-speaker-names"
+                            :transcription="props.transcription"
+                        />
+                        <TranscriptionList
+                            id="edit-transcription-list"
+                            :transcription="props.transcription"
+                            :currentTime="currentTime"
+                            :autoScrollEnabled="autoScrollEnabled"
+                        />
+                    </div>
+                </div>
+            </template>
+        </div>
+    </div>
+</template>
diff --git a/app/components/TranscriptionInfoView.vue b/app/components/TranscriptionInfoView.vue
new file mode 100644
index 0000000..3775982
--- /dev/null
+++ b/app/components/TranscriptionInfoView.vue
@@ -0,0 +1,105 @@
+<script setup lang="ts">
+import { motion } from 'motion-v';
+import { TranscriptionNameChangeCommand } from '~/types/commands';
+import type { StoredTranscription } from '~/types/storedTranscription';
+
+
+interface InputProps {
+    transcription: StoredTranscription,
+}
+
+const props = defineProps<InputProps>();
+
+const { t } = useI18n();
+const { executeCommand } = useCommandBus();
+
+const isInfoExpanded = ref(false);
+
+const mediaUrl = computed(() => {
+    if (props.transcription.mediaFile) {
+        return URL.createObjectURL(
+            props.transcription.mediaFile,
+        );
+    }
+
+    return undefined;
+});
+
+const mediaName = computed(() => {
+    if (props.transcription.mediaFileName) {
+        return props.transcription.mediaFileName;
+    }
+
+    return undefined;
+});
+
+async function handleNameChange(name: string | number) {
+    if (typeof name === "string") {
+        await executeCommand(new TranscriptionNameChangeCommand(name));
+    }
+}
+</script>
+
+<template>
+    <motion.div
+        id="transcription-info"
+        :animate="{ opacity: 1, x: 0 }"
+        :initial="{ opacity: 0, x: -10 }"
+        :transition="{ ...pageTransition, delay: staggerDelay }"
+    >
+        <UPopover v-model:open="isInfoExpanded" :ui="{ content: 'p-0 min-w-72' }">
+            <UButton
+                id="transcription-info-button"
+                variant="ghost"
+                color="neutral"
+                size="sm"
+                class="gap-2"
+            >
+                <template #leading>
+                    <div
+                        class="w-6 h-6 rounded-md bg-linear-to-br from-blue-500/10 to-purple-500/10 dark:from-blue-400/20 dark:to-purple-400/20 flex items-center justify-center">
+                        <UIcon name="i-lucide-info" class="w-3.5 h-3.5 text-blue-500 dark:text-blue-400" />
+                    </div>
+                </template>
+                <span class="truncate max-w-32 sm:max-w-48">{{ props.transcription.name || t('transcription.info')
+                    }}</span>
+                <template #trailing>
+                    <UIcon name="i-lucide-chevron-down" class="w-4 h-4 transition-transform duration-200"
+                        :class="{ 'rotate-180': isInfoExpanded }" />
+                </template>
+            </UButton>
+
+            <template #content>
+                <motion.div :animate="{ opacity: 1, y: 0 }" :initial="{ opacity: 0, y: -5 }"
+                    :transition="{ duration: 0.2 }"
+                    class="p-4 space-y-4 bg-white dark:bg-gray-800 rounded-lg shadow-xl border border-gray-200 dark:border-gray-700">
+                    <!-- File Name Input -->
+                    <div class="space-y-1.5">
+                        <label class="text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wide">
+                            {{ t('transcription.nameLabel') || 'Name' }}
+                        </label>
+                        <UInput class="w-full" :model-value="props.transcription.name"
+                            @update:model-value="handleNameChange" :placeholder="t('transcription.namePlaceholder')"
+                            size="sm" />
+                    </div>
+
+                    <!-- Download Media Button -->
+                    <div class="pt-2 border-t border-gray-200 dark:border-gray-700">
+                        <!-- biome-ignore lint/a11y/useAnchorContent: UButton inside provides accessible content -->
+                        <a v-if="mediaUrl && mediaName" :href="mediaUrl" :download="mediaName" :aria-label="t('media.downloadMedia')">
+                            <motion.div :whileHover="{ scale: 1.02 }" :whileTap="{ scale: 0.98 }"
+                                :transition="{ type: 'spring' as const, stiffness: 400, damping: 17 }">
+                                <UButton icon="i-lucide-download" variant="soft" :label="t('media.downloadMedia')"
+                                    color="info" size="sm" block />
+                            </motion.div>
+                        </a>
+                        <div v-else class="flex items-center gap-2 text-sm text-gray-400 dark:text-gray-500 italic">
+                            <UIcon name="i-lucide-file-x" class="w-4 h-4" />
+                            {{ t('media.noMedia') }}
+                        </div>
+                    </div>
+                </motion.div>
+            </template>
+        </UPopover>
+    </motion.div>
+</template>
diff --git a/app/components/TranscriptionSummaryView.vue b/app/components/TranscriptionSummaryView.vue
new file mode 100644
index 0000000..8431eb8
--- /dev/null
+++ b/app/components/TranscriptionSummaryView.vue
@@ -0,0 +1,254 @@
+<script setup lang="ts">
+import type { SelectMenuItem } from "@nuxt/ui";
+import { useStorage } from "@vueuse/core";
+import { match } from "ts-pattern";
+import type { SummaryType } from "#shared/types/summary";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import { languages } from "~/utils/languages";
+
+interface Props {
+    transcription: StoredTranscription;
+}
+
+const props = defineProps<Props>();
+
+const { isSummaryGenerating, generateSummary } = useTranscriptionSummary();
+const { exportSummaryAsDocx } = useExport();
+const { t } = useI18n();
+
+const summaryOptions: {
+    label: string;
+    value: SummaryType;
+    description?: string;
+}[] = [
+    {
+        label: t("summary.types.kurzprotokoll"),
+        value: "kurzprotokoll",
+        description: t("summary.types.kurzprotokollDesc"),
+    },
+    {
+        label: t("summary.types.ergebnisprotokoll"),
+        value: "ergebnisprotokoll",
+        description: t("summary.types.ergebnisprotokollDesc"),
+    },
+    {
+        label: t("summary.types.verhandlungsprotokoll"),
+        value: "verhandlungsprotokoll",
+        description: t("summary.types.verhandlungsprotokollDesc"),
+    },
+];
+const summaryType = ref<SummaryType>("kurzprotokoll");
+
+// Language selection with persistence
+const selectedLanguage = useStorage<string | undefined>(
+    "summary-language",
+    "auto",
+);
+
+// Language options for the select menu
+const languageOptions = computed<SelectMenuItem[]>(() => [
+    {
+        label: t("languages.autoDetect"),
+        value: "auto",
+        icon: "i-lucide-languages",
+    },
+    ...languages.map((lang) => ({
+        label: t(`languages.${lang.code}`),
+        value: lang.code,
+        icon: lang.icon,
+    })),
+]);
+
+const summaryError = ref<string | null>(null);
+
+async function handleGenerateSummary(): Promise<void> {
+    if (isSummaryGenerating.value || !props.transcription) return;
+
+    summaryError.value = null;
+
+    const language = match(selectedLanguage.value)
+        .with("auto", () => undefined)
+        .otherwise((lang) => lang);
+
+    try {
+        await generateSummary(props.transcription, summaryType.value, language);
+    } catch (error) {
+        summaryError.value =
+            error instanceof Error
+                ? error.message
+                : "Failed to generate summary";
+    }
+}
+</script>
+
+<template>
+    <div class="bg-linear-to-br">
+        <!-- Header -->
+        <div class="flex flex-wrap items-center justify-between p-4">
+            <div class="flex items-center gap-3">
+                <div
+                    class="w-9 h-9 rounded-lg bg-linear-to-br from-amber-400/20 to-orange-400/20 flex items-center justify-center ring-1 ring-amber-400/30"
+                >
+                    <UIcon
+                        name="i-lucide-sparkles"
+                        class="w-5 h-5 text-amber-600"
+                    />
+                </div>
+                <h3 class="text-lg font-semibold text-gray-800">
+                    {{ t("summary.title") }}
+                </h3>
+            </div>
+
+            <div class="flex-1 flex gap-2 justify-end">
+                <div id="generate-summary-button">
+                    <UPopover v-if="!props.transcription.summary">
+                        <UButton
+                            icon="i-lucide-lightbulb"
+                            variant="soft"
+                            color="warning"
+                            size="sm"
+                            :label="t('summary.generate')"
+                            class="shadow-sm"
+                        />
+
+                        <template #content>
+                            <div class="p-4 w-80">
+                                <h4 class="font-medium text-sm mb-3">
+                                    {{ t("summary.selectType") }}
+                                </h4>
+                                <URadioGroup
+                                    v-model="summaryType"
+                                    :items="summaryOptions"
+                                    value-key="value"
+                                    class="mb-4"
+                                />
+                                <h4 class="font-medium text-sm mb-2">
+                                    {{ t("summary.selectLanguage") }}
+                                </h4>
+                                <USelectMenu
+                                    v-model="selectedLanguage"
+                                    :items="languageOptions"
+                                    label-key="label"
+                                    value-key="value"
+                                    class="mb-4"
+                                />
+                                <UButton
+                                    block
+                                    color="warning"
+                                    :label="t('summary.generate')"
+                                    :loading="isSummaryGenerating"
+                                    :disabled="isSummaryGenerating"
+                                    @click="handleGenerateSummary"
+                                />
+                            </div>
+                        </template>
+                    </UPopover>
+
+                    <template v-else>
+                        <UPopover>
+                            <UButton
+                                icon="i-lucide-refresh-cw"
+                                variant="ghost"
+                                color="primary"
+                                size="sm"
+                                :label="t('summary.regenerate')"
+                            />
+
+                            <template #content>
+                                <div class="p-4 w-80">
+                                    <h4 class="font-medium text-sm mb-3">
+                                        {{ t("summary.selectType") }}
+                                    </h4>
+                                    <URadioGroup
+                                        v-model="summaryType"
+                                        :items="summaryOptions"
+                                        value-key="value"
+                                        class="mb-4"
+                                    />
+                                    <h4 class="font-medium text-sm mb-2">
+                                        {{ t("summary.selectLanguage") }}
+                                    </h4>
+                                    <USelectMenu
+                                        v-model="selectedLanguage"
+                                        :items="languageOptions"
+                                        value-key="value"
+                                        label-key="label"
+                                        class="mb-4 w-full"
+                                    />
+                                    <UButton
+                                        block
+                                        color="primary"
+                                        :label="t('summary.regenerate')"
+                                        :loading="isSummaryGenerating"
+                                        :disabled="isSummaryGenerating"
+                                        @click="handleGenerateSummary"
+                                    />
+                                </div>
+                            </template>
+                        </UPopover>
+                        <UButton
+                            icon="i-lucide-download"
+                            variant="ghost"
+                            color="primary"
+                            size="sm"
+                            :label="t('summary.export')"
+                            @click="
+                                () => exportSummaryAsDocx(props.transcription)
+                            "
+                        />
+                    </template>
+                </div>
+            </div>
+        </div>
+
+        <!-- Error Alert -->
+        <div v-if="summaryError" class="px-4 pb-4">
+            <UAlert
+                color="error"
+                :title="t('summary.error')"
+                :description="summaryError"
+                icon="i-lucide-triangle-alert"
+                closable
+                @close="summaryError = null"
+                class="shadow-sm"
+            />
+        </div>
+
+        <div
+            v-if="isSummaryGenerating"
+            class="p-6 text-center border-t border-amber-200/50"
+        >
+            <UIcon
+                name="i-lucide-loader-2"
+                class="w-8 h-8 text-amber-500 animate-spin mx-auto mb-4"
+            />
+            <p class="text-gray-500">
+                {{ t("summary.generating") || "Generating summary..." }}
+            </p>
+        </div>
+
+        <!-- Summary Content -->
+        <div v-if="props.transcription.summary">
+            <div
+                id="summary-content"
+                class="p-4 border-t border-amber-200/50 bg-white/40"
+            >
+                <div
+                    class="prose prose-sm max-w-none overflow-y-auto prose-amber"
+                >
+                    <MDC :value="props.transcription.summary" />
+                </div>
+            </div>
+        </div>
+
+        <!-- Empty State -->
+        <div
+            v-else-if="!isSummaryGenerating"
+            class="p-6 text-center border-t border-amber-200/50"
+        >
+            <p class="text-gray-500 text-sm">
+                {{ t("summary.empty") || "No summary generated yet" }}
+            </p>
+        </div>
+    </div>
+</template>
diff --git a/app/components/TranscriptionViewer.vue b/app/components/TranscriptionViewer.vue
index e2a5a44..d882b73 100644
--- a/app/components/TranscriptionViewer.vue
+++ b/app/components/TranscriptionViewer.vue
@@ -1,24 +1,30 @@
 <script lang="ts" setup>
-import type { SegementWithId } from "~/types/transcriptionResponse";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import type { SegmentWithId } from "~/types/transcriptionResponse";
 
-const { currentTranscription } = useCurrentTranscription();
+interface InputProps {
+    transcription: StoredTranscription;
+}
+
+const props = defineProps<InputProps>();
 
 // Viewer mode options
-const showSpeakers = ref(true);
-const showTimestamps = ref(false);
-const mergeSegments = ref(false);
+const showSpeakers = useLocalStorage<boolean>("setting:show-speaker", true);
+const showTimestamps = useLocalStorage<boolean>(
+    "setting:show-timestamps",
+    false,
+);
+const mergeSegments = useLocalStorage<boolean>("setting:merge-segments", true);
 
 /**
  * Merges consecutive segments from the same speaker into single segments
  * @param segments - Array of segments to merge
  * @returns Array of merged segments
  */
-function mergeConsecutiveSegments(
-    segments: SegementWithId[],
-): SegementWithId[] {
+function mergeConsecutiveSegments(segments: SegmentWithId[]): SegmentWithId[] {
     if (segments.length === 0) return [];
 
-    const merged: SegementWithId[] = [];
+    const merged: SegmentWithId[] = [];
     let currentSegment = { ...segments[0] };
 
     for (let i = 1; i < segments.length; i++) {
@@ -35,21 +41,19 @@ function mergeConsecutiveSegments(
             currentSegment.end = nextSegment.end;
         } else {
             // Different speaker, save current and start new
-            merged.push(currentSegment as SegementWithId);
+            merged.push(currentSegment as SegmentWithId);
             currentSegment = { ...nextSegment };
         }
     }
 
     // Don't forget the last segment
-    merged.push(currentSegment as SegementWithId);
+    merged.push(currentSegment as SegmentWithId);
     return merged;
 }
 
 // Computed property to generate the formatted text
 const formattedTranscript = computed(() => {
-    if (!currentTranscription.value) return "";
-
-    let segments = currentTranscription.value.segments;
+    let segments = props.transcription.segments;
 
     // Merge segments if requested
     if (mergeSegments.value) {
@@ -89,36 +93,44 @@ const { t } = useI18n();
 </script>
 
 <template>
-    <div class="h-full flex flex-col">
+    <div class="grow h-full flex flex-col">
         <!-- Viewer Controls -->
-        <div class="flex items-center gap-4 p-4 border-b border-gray-200 bg-gray-50">
-            <h3 class="font-medium text-sm">{{ t('viewer.displayOptions') }}</h3>
-            
+        <div
+            id="viewer-display-options"
+            class="flex flex-wrap items-center gap-4 p-4 border-b border-gray-200 bg-gray-50"
+        >
+            <h3 class="font-medium text-sm">
+                {{ t("viewer.displayOptions") }}
+            </h3>
+
             <!-- Show Speakers Toggle -->
             <div class="flex items-center gap-2">
-                <USwitch 
-                    v-model="showSpeakers" 
+                <USwitch
+                    id="viewer-show-speakers"
+                    v-model="showSpeakers"
                     size="sm"
                 />
-                <span class="text-sm">{{ t('viewer.showSpeakers') }}</span>
+                <span class="text-sm">{{ t("viewer.showSpeakers") }}</span>
             </div>
-            
+
             <!-- Show Timestamps Toggle -->
             <div class="flex items-center gap-2">
-                <USwitch 
-                    v-model="showTimestamps" 
+                <USwitch
+                    id="viewer-show-timestamps"
+                    v-model="showTimestamps"
                     size="sm"
                 />
-                <span class="text-sm">{{ t('viewer.showTimestamps') }}</span>
+                <span class="text-sm">{{ t("viewer.showTimestamps") }}</span>
             </div>
-            
+
             <!-- Merge Segments Toggle -->
             <div class="flex items-center gap-2">
-                <USwitch 
-                    v-model="mergeSegments" 
+                <USwitch
+                    id="viewer-merge-segments"
+                    v-model="mergeSegments"
                     size="sm"
                 />
-                <span class="text-sm">{{ t('viewer.mergeSegments') }}</span>
+                <span class="text-sm">{{ t("viewer.mergeSegments") }}</span>
             </div>
         </div>
 
diff --git a/app/components/UploadMediaView.client.vue b/app/components/UploadMediaView.client.vue
deleted file mode 100644
index 3622ac2..0000000
--- a/app/components/UploadMediaView.client.vue
+++ /dev/null
@@ -1,336 +0,0 @@
-<script lang="ts" setup>
-import type { SelectMenuItem } from "@nuxt/ui";
-
-const { t } = useI18n();
-const logger = useLogger();
-
-const { uploadFile, audioLanguage, numSpeakers, progressMessage, showProgress } = useAudioUpload();
-
-// Track the conversion progress
-const errorMessage = ref("");
-
-// Track selected file
-const selectedFile = ref<File | undefined>();
-const processedFile = ref<File | Blob | undefined>();
-const isVideoFile = ref(false);
-const showFilePreview = ref(false);
-
-// Template ref for file input
-const fileInputRef = ref<HTMLInputElement | null>(null);
-
-// Speaker options for the select input
-const speakerOptions = [
-    { label: t("upload.autoDetection"), value: "auto" },
-    { label: "1", value: "1" },
-    { label: "2", value: "2" },
-    { label: "3", value: "3" },
-    { label: "4", value: "4" },
-    { label: "5", value: "5" },
-    { label: "6", value: "6" },
-];
-const audioLanguageOptions = ref<SelectMenuItem[]>([
-    { label: t("upload.autoDetection"), value: "auto" },
-    { label: t("languages.de"), value: "de" },
-    { label: t("languages.fr"), value: "fr" },
-    { label: t("languages.it"), value: "it" },
-    { label: t("languages.en"), value: "en" },
-    { label: t("languages.es"), value: "es" },
-    { label: t("languages.pt"), value: "pt" },
-    { label: t("languages.ru"), value: "ru" },
-    { label: t("languages.zh"), value: "zh" },
-    { label: t("languages.ko"), value: "ko" },
-    { label: t("languages.ja"), value: "ja" },
-    { label: t("languages.tr"), value: "tr" },
-    { label: t("languages.pl"), value: "pl" },
-    { label: t("languages.ca"), value: "ca" },
-    { label: t("languages.nl"), value: "nl" },
-    { label: t("languages.ar"), value: "ar" },
-    { label: t("languages.sv"), value: "sv" },
-    { label: t("languages.id"), value: "id" },
-    { label: t("languages.hi"), value: "hi" },
-    { label: t("languages.fi"), value: "fi" },
-    { label: t("languages.vi"), value: "vi" },
-    { label: t("languages.he"), value: "he" },
-    { label: t("languages.uk"), value: "uk" },
-    { label: t("languages.el"), value: "el" },
-    { label: t("languages.ms"), value: "ms" },
-    { label: t("languages.cs"), value: "cs" },
-    { label: t("languages.ro"), value: "ro" },
-    { label: t("languages.da"), value: "da" },
-    { label: t("languages.hu"), value: "hu" },
-    { label: t("languages.ta"), value: "ta" },
-    { label: t("languages.no"), value: "no" },
-    { label: t("languages.th"), value: "th" },
-    { label: t("languages.ur"), value: "ur" },
-    { label: t("languages.hr"), value: "hr" },
-    { label: t("languages.bg"), value: "bg" },
-    { label: t("languages.lt"), value: "lt" },
-    { label: t("languages.la"), value: "la" },
-    { label: t("languages.mi"), value: "mi" },
-    { label: t("languages.ml"), value: "ml" },
-    { label: t("languages.cy"), value: "cy" },
-    { label: t("languages.sk"), value: "sk" },
-    { label: t("languages.te"), value: "te" },
-    { label: t("languages.fa"), value: "fa" },
-    { label: t("languages.lv"), value: "lv" },
-    { label: t("languages.bn"), value: "bn" },
-    { label: t("languages.sr"), value: "sr" },
-    { label: t("languages.az"), value: "az" },
-    { label: t("languages.sl"), value: "sl" },
-    { label: t("languages.kn"), value: "kn" },
-    { label: t("languages.et"), value: "et" },
-    { label: t("languages.mk"), value: "mk" },
-    { label: t("languages.br"), value: "br" },
-    { label: t("languages.eu"), value: "eu" },
-    { label: t("languages.is"), value: "is" },
-    { label: t("languages.hy"), value: "hy" },
-    { label: t("languages.ne"), value: "ne" },
-    { label: t("languages.mn"), value: "mn" },
-    { label: t("languages.bs"), value: "bs" },
-    { label: t("languages.kk"), value: "kk" },
-    { label: t("languages.sq"), value: "sq" },
-    { label: t("languages.sw"), value: "sw" },
-    { label: t("languages.gl"), value: "gl" },
-    { label: t("languages.mr"), value: "mr" },
-    { label: t("languages.pa"), value: "pa" },
-    { label: t("languages.si"), value: "si" },
-    { label: t("languages.km"), value: "km" },
-    { label: t("languages.sn"), value: "sn" },
-    { label: t("languages.yo"), value: "yo" },
-    { label: t("languages.so"), value: "so" },
-    { label: t("languages.af"), value: "af" },
-    { label: t("languages.oc"), value: "oc" },
-    { label: t("languages.ka"), value: "ka" },
-    { label: t("languages.be"), value: "be" },
-    { label: t("languages.tg"), value: "tg" },
-    { label: t("languages.sd"), value: "sd" },
-    { label: t("languages.gu"), value: "gu" },
-    { label: t("languages.am"), value: "am" },
-    { label: t("languages.yi"), value: "yi" },
-    { label: t("languages.lo"), value: "lo" },
-    { label: t("languages.uz"), value: "uz" },
-    { label: t("languages.fo"), value: "fo" },
-    { label: t("languages.ht"), value: "ht" },
-    { label: t("languages.ps"), value: "ps" },
-    { label: t("languages.tk"), value: "tk" },
-    { label: t("languages.nn"), value: "nn" },
-    { label: t("languages.mt"), value: "mt" },
-    { label: t("languages.sa"), value: "sa" },
-    { label: t("languages.lb"), value: "lb" },
-    { label: t("languages.my"), value: "my" },
-    { label: t("languages.bo"), value: "bo" },
-    { label: t("languages.tl"), value: "tl" },
-    { label: t("languages.mg"), value: "mg" },
-    { label: t("languages.as"), value: "as" },
-    { label: t("languages.tt"), value: "tt" },
-    { label: t("languages.haw"), value: "haw" },
-    { label: t("languages.ln"), value: "ln" },
-    { label: t("languages.ha"), value: "ha" },
-    { label: t("languages.ba"), value: "ba" },
-    { label: t("languages.jw"), value: "jw" },
-    { label: t("languages.su"), value: "su" },
-    { label: t("languages.yue"), value: "yue" }
-]);
-
-/**
- * Check if the file is a video file based on MIME type
- */
-function checkIfVideoFile(file: File): boolean {
-    return file.type.startsWith("video/");
-}
-
-/**
- * Format file size in human readable format
- */
-function formatFileSize(bytes: number): string {
-    if (bytes === 0) return "0 Bytes";
-    const k = 1024;
-    const sizes = ["Bytes", "KB", "MB", "GB"];
-    const i = Math.floor(Math.log(bytes) / Math.log(k));
-    return `${Number.parseFloat((bytes / k ** i).toFixed(2))} ${sizes[i]}`;
-}
-
-const { extractAudioFromVideo } = useAudioExtract();
-
-/**
- * Handles the file selection and processing
- */
-const loadAudio = async (event: Event): Promise<void> => {
-    if (!event.target) {
-        return;
-    }
-
-    const target = event.target as HTMLInputElement;
-    if (!target.files || target.files.length === 0) {
-        return;
-    }
-
-    const mediaFile = target.files[0];
-    if (!mediaFile) {
-        return;
-    }
-
-    selectedFile.value = mediaFile;
-    isVideoFile.value = checkIfVideoFile(mediaFile);
-    errorMessage.value = "";
-
-    try {
-        if (isVideoFile.value) {
-            // Extract audio from video files
-            showProgress.value = true;
-            progressMessage.value = t("upload.extractingAudio");
-            const { audioBlob, audioFileName } = await extractAudioFromVideo(mediaFile);
-
-            // Create a File object from the blob with appropriate name
-            processedFile.value = new File([audioBlob], audioFileName, {
-                type: "audio/wav",
-            });
-        } else {
-            // For audio files, use them directly
-            processedFile.value = mediaFile;
-        }
-
-        showFilePreview.value = true;
-    } catch (error) {
-        logger.error("Error processing media file:", error);
-        errorMessage.value = t("upload.processingError");
-    } finally {
-        showProgress.value = false;
-    }
-};
-
-/**
- * Clears the selected file and resets the UI
- */
-function clearSelectedFile(): void {
-    selectedFile.value = undefined;
-    processedFile.value = undefined;
-    showFilePreview.value = false;
-    errorMessage.value = "";
-
-    // Reset the file input
-    if (fileInputRef.value) {
-        fileInputRef.value.value = "";
-    }
-}
-
-/**
- * Uploads the file to the server when user clicks "Use this file"
- */
-async function useThisFile(): Promise<void> {
-    if (!processedFile.value || !selectedFile.value) {
-        return;
-    }
-
-    try {
-        await uploadFile(processedFile.value, selectedFile.value);
-    } catch (error) {
-        logger.error("Error uploading file:", error);
-        errorMessage.value = t("upload.uploadError");
-    }
-}
-</script>
-
-<template>
-    <div>
-        <!-- File Input Section -->
-        <div v-if="!showFilePreview" class="space-y-4">
-            <UInput type="file" accept="audio/*,video/*" size="xl" icon="i-lucide-file-up" :disabled="showProgress"
-                @change="loadAudio" ref="fileInputRef" />
-        </div>
-
-        <!-- File Preview Section -->
-        <div v-else-if="selectedFile" class="space-y-4">
-            <UCard>
-                <template #header>
-                    <div class="flex items-center justify-between">
-                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white">
-                            {{ t('upload.filePreview') || 'File Preview' }}
-                        </h3>
-                        <UButton variant="ghost" size="sm" icon="i-lucide-x" @click="clearSelectedFile" />
-                    </div>
-                </template>
-
-                <div class="space-y-4">
-                    <!-- File Info -->
-                    <div class="flex items-start gap-3">
-                        <div class="p-2 bg-blue-100 dark:bg-blue-900/30 rounded-lg">
-                            <UIcon :name="isVideoFile ? 'i-lucide-file-video-camera' : 'i-lucide-file-music'"
-                                class="w-6 h-6 text-blue-600 dark:text-blue-400" />
-                        </div>
-                        <div class="flex-1 min-w-0">
-                            <p class="font-medium text-gray-900 dark:text-white truncate">
-                                {{ selectedFile.name }}
-                            </p>
-                            <p class="text-sm text-gray-500 dark:text-gray-400">
-                                {{ formatFileSize(selectedFile.size) }}
-                                <span v-if="isVideoFile"
-                                    class="ml-2 px-2 py-1 bg-purple-100 dark:bg-purple-900/30 text-purple-700 dark:text-purple-300 text-xs rounded">
-                                    {{ t('upload.videoFile') || 'Video' }}
-                                </span>
-                                <span v-else
-                                    class="ml-2 px-2 py-1 bg-green-100 dark:bg-green-900/30 text-green-700 dark:text-green-300 text-xs rounded">
-                                    {{ t('upload.audioFile') || 'Audio' }}
-                                </span>
-                            </p>
-                            <p v-if="isVideoFile" class="text-xs text-gray-400 dark:text-gray-500 mt-1">
-                                {{ t('upload.audioWillBeExtracted') || 'Audio will be extracted for transcription' }}
-                            </p>
-                        </div>
-                    </div>
-
-                    <!-- Action Buttons -->
-                    <div class="flex gap-3 pt-4 border-t">
-                        <UButton color="primary" size="lg" :loading="showProgress" :disabled="showProgress"
-                            @click="useThisFile">
-                            <template #leading>
-                                <UIcon name="i-lucide-play" />
-                            </template>
-                            {{ t('upload.useThisFile') || 'Use this file' }}
-                        </UButton>
-
-                        <UButton variant="ghost" size="lg" :disabled="showProgress" @click="clearSelectedFile">
-                            {{ t('upload.selectDifferentFile') || 'Select different file' }}
-                        </UButton>
-                    </div>
-                </div>
-            </UCard>
-        </div>
-
-        <!-- Shared Configuration Section -->
-        <div class="space-y-4 mt-4">
-            <div>
-                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
-                    {{ t("upload.numSpeakers") }}
-                </label>
-                <p class="text-xs text-gray-500 dark:text-gray-400 mb-2">
-                    {{ t("upload.numSpeakersHelp") }}
-                </p>
-                <USelect v-model="numSpeakers" :items="speakerOptions" :disabled="showProgress"
-                    :ui="{ base: 'w-[250px]' }" placeholder="Select number of speakers" />
-            </div>
-            <div>
-                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
-                    {{ t("upload.audioLanguage") }}
-                </label>
-                <p class="text-xs text-gray-500 dark:text-gray-400 mb-2">
-                    {{ t("upload.audioLanguageHelp") }}
-                </p>
-                <USelectMenu v-model="audioLanguage" value-key="value" :ui="{ base: 'w-[250px]' }"
-                    :items="audioLanguageOptions" :disabled="showProgress" />
-            </div>
-        </div>
-
-        <!-- Progress Section -->
-        <div v-if="showProgress" class="mt-4">
-            <p class="text-sm text-gray-600 dark:text-gray-400">{{ progressMessage }}</p>
-            <UProgress class="mt-2" />
-        </div>
-
-        <!-- Error Message -->
-        <UAlert v-if="errorMessage" class="mt-4" color="error" variant="solid" :title="t('upload.error') || 'Error'"
-            :description="errorMessage" />
-    </div>
-</template>
-
-<style scoped></style>
diff --git a/app/components/media/CurrentSegementEditor.vue b/app/components/media/CurrentSegementEditor.vue
index 3b65f5b..1f0c2c0 100644
--- a/app/components/media/CurrentSegementEditor.vue
+++ b/app/components/media/CurrentSegementEditor.vue
@@ -1,16 +1,22 @@
 <script lang="ts" setup>
 import { UButton } from "#components";
+import type { StoredTranscription } from "~/types/storedTranscription";
 import { AddSegmentCommand } from "../../types/commands";
 import TranscriptionListItem from "../transcriptionList/TranscriptionSegmentEdit.vue";
 
 interface CurrentSegmentEditorProps {
+    transcription: StoredTranscription,
     currentTime: number;
     duration: number;
 }
 
 const props = defineProps<CurrentSegmentEditorProps>();
 
-const { segments, speakers } = useCurrentTranscription();
+const segments = computed(() => props.transcription.segments);
+const speakers = computed(() =>
+    Array.from(getUniqueSpeakers(segments.value)),
+);
+
 const { executeCommand } = useCommandBus();
 const { t } = useI18n();
 
@@ -52,10 +58,7 @@ async function handleAddSegment() {
 
 <template>
     <div>
-        <div
-            v-for="segment in currentSegments"
-            :key="segment.text + segment.start"
-        >
+        <div v-for="segment in currentSegments" :key="segment.text + segment.start">
             <TranscriptionListItem :segment="segment" :speakers="speakers" />
         </div>
         <div v-if="currentSegments.length === 0">
diff --git a/app/components/media/TimelineView.client.vue b/app/components/media/TimelineView.client.vue
index e0e54cf..d074537 100644
--- a/app/components/media/TimelineView.client.vue
+++ b/app/components/media/TimelineView.client.vue
@@ -5,13 +5,15 @@ import type { Stage, StageConfig } from "konva/lib/Stage";
 import type { Rect, RectConfig } from "konva/lib/shapes/Rect";
 import type { Box, TransformerConfig } from "konva/lib/shapes/Transformer";
 import TimeAxisLayer from "~/components/timeline/TimeAxisLayer.vue";
-import { UpdateSegementCommand } from "~/types/commands";
+import { UpdateSegmentCommand } from "~/types/commands";
+import type { StoredTranscription } from "~/types/storedTranscription";
 
 // -----------------------------------------------------------------
 // Props and constants
 // -----------------------------------------------------------------
 
 interface TimelineViewProps {
+    transcription: StoredTranscription,
     currentTime: number;
     duration: number;
     zoomX: number;
@@ -33,7 +35,8 @@ const { executeCommand } = useCommandBus();
 const { checkSnap, createDragBoundFunc, findSnapPoints } = useTimelineSegment(
     computed(() => props.zoomX),
 );
-const { segments } = useCurrentTranscription();
+
+const segments = computed(() => props.transcription.segments ?? []);
 
 // -----------------------------------------------------------------
 // References and state
@@ -283,7 +286,7 @@ function onDragEnd(e: KonvaEventObject<MouseEvent, Rect>): void {
 
     // Update the segment with new times
     executeCommand(
-        new UpdateSegementCommand(segmentId, {
+        new UpdateSegmentCommand(segmentId, {
             start: Math.max(0, newStart),
             end: Math.max(newStart + 0.5, newEnd),
         }),
@@ -313,7 +316,7 @@ function onTransformEnd(e: KonvaEventObject<MouseEvent, Rect>): void {
 
     const segmentId = segment.id;
     executeCommand(
-        new UpdateSegementCommand(segmentId, {
+        new UpdateSegmentCommand(segmentId, {
             start: Math.max(0, newStart),
             end: Math.max(newStart + 0.5, newEnd), // Ensure minimum duration
         }),
@@ -481,82 +484,57 @@ function onPointerMove(e: KonvaEventObject<MouseEvent, Stage>): void {
 </script>
 
 <template>
-  <div ref="container" class="w-full">
-    <v-stage
-      v-if="segments.length > 0"
-      :config="configKonva"
-      @mousemove="onPointerMove"
-      @click="clearSelection"
-    >
-      <!-- Time Axis layer -->
-      <TimeAxisLayer
-        :start-time="props.startTime"
-        :end-time="props.endTime"
-        :zoom-x="props.zoomX"
-        :stage-width="stageWidth"
-      />
-
-      <!-- Timeline segments layer -->
-      <v-layer :config="timelineLayerConfig">
-        <v-rect
-          v-for="(rectConfig, index) in rectConfigs"
-          :key="index"
-          :config="rectConfig"
-          @click="
-            (e: KonvaEventObject<MouseEvent, Rect>) =>
-              onSegmentClicked(e, rectConfig.id!)
-          "
-          @mouseenter="onSegmentMouseEnter($event, rectConfig.text!)"
-          @mouseleave="onSegmentMouseLeave()"
-          @dragmove="onDragMove"
-          @dragend="onDragEnd"
-          @transform="onTransform"
-          @transformend="onTransformEnd"
-        />
-      </v-layer>
-
-      <v-layer :config="playerHeaderLayerConfig">
-        <v-line :config="playheadLineConfig" />
-      </v-layer>
-
-      <v-layer>
-        <v-transformer :config="transformerConfig" />
-      </v-layer>
-
-      <!-- Tooltip layer -->
-      <v-layer>
-        <v-label
-          v-if="tooltipVisible"
-          :config="{
-            x: tooltipPosition.x,
-            y: tooltipPosition.y,
-            opacity: 0.75,
-          }"
-        >
-          <v-tag
-            :config="{
-              fill: 'black',
-              pointerDirection: 'down',
-              pointerWidth: 10,
-              pointerHeight: 10,
-              lineJoin: 'round',
-              shadowColor: 'black',
-              shadowBlur: 10,
-              shadowOffset: { x: 5, y: 5 },
-              shadowOpacity: 0.5,
-            }"
-          />
-          <v-text
-            :config="{
-              text: tooltipText,
-              fontSize: 14,
-              padding: 5,
-              fill: 'white',
-              maxWidth: 300,
-            }"
-          />
-        </v-label>
-      </v-layer>
-    </v-stage>
-  </div>
+    <div ref="container" class="w-full">
+        <v-stage v-if="segments.length > 0" :config="configKonva" @mousemove="onPointerMove" @click="clearSelection">
+            <!-- Time Axis layer -->
+            <TimeAxisLayer :start-time="props.startTime" :end-time="props.endTime" :zoom-x="props.zoomX"
+                :stage-width="stageWidth" />
+
+            <!-- Timeline segments layer -->
+            <v-layer :config="timelineLayerConfig">
+                <v-rect v-for="(rectConfig, index) in rectConfigs" :key="index" :config="rectConfig" @click="
+                    (e: KonvaEventObject<MouseEvent, Rect>) =>
+                        onSegmentClicked(e, rectConfig.id!)
+                " @mouseenter="onSegmentMouseEnter($event, rectConfig.text!)" @mouseleave="onSegmentMouseLeave()"
+                    @dragmove="onDragMove" @dragend="onDragEnd" @transform="onTransform"
+                    @transformend="onTransformEnd" />
+            </v-layer>
+
+            <v-layer :config="playerHeaderLayerConfig">
+                <v-line :config="playheadLineConfig" />
+            </v-layer>
+
+            <v-layer>
+                <v-transformer :config="transformerConfig" />
+            </v-layer>
+
+            <!-- Tooltip layer -->
+            <v-layer>
+                <v-label v-if="tooltipVisible" :config="{
+                    x: tooltipPosition.x,
+                    y: tooltipPosition.y,
+                    opacity: 0.75,
+                }">
+                    <v-tag :config="{
+                        fill: 'black',
+                        pointerDirection: 'down',
+                        pointerWidth: 10,
+                        pointerHeight: 10,
+                        lineJoin: 'round',
+                        shadowColor: 'black',
+                        shadowBlur: 10,
+                        shadowOffset: { x: 5, y: 5 },
+                        shadowOpacity: 0.5,
+                    }" />
+                    <v-text :config="{
+                        text: tooltipText,
+                        fontSize: 14,
+                        padding: 5,
+                        fill: 'white',
+                        maxWidth: 300,
+                    }" />
+                </v-label>
+            </v-layer>
+        </v-stage>
+    </div>
 </template>
diff --git a/app/components/media/VideoView.vue b/app/components/media/VideoView.vue
index f307fba..1c54d3e 100644
--- a/app/components/media/VideoView.vue
+++ b/app/components/media/VideoView.vue
@@ -1,22 +1,23 @@
 <script lang="ts" setup>
 import type { SeekToSecondsCommand, TogglePlayCommand } from "~/types/commands";
 import { Cmds } from "~/types/commands";
+import type { StoredTranscription } from "~/types/storedTranscription";
 import { formatTime } from "~/utils/time";
 
-// Import useI18n composable
-const { t } = useI18n();
-
 interface VideoViewProps {
-  duration: number;
+    duration: number;
+    transcription: StoredTranscription
 }
 
+// Import useI18n composable
+const { t } = useI18n();
+
 const props = defineProps<VideoViewProps>();
-const transcriptionStore = useTranscriptionsStore();
 
 const mediaFile = ref<Blob | null>(null);
 const mediaSrc = ref<string>("");
 const segments = shallowRef(
-  transcriptionStore.currentTranscription?.segments ?? [],
+    props.transcription.segments ?? [],
 );
 const videoElement = ref<HTMLVideoElement | null>(null);
 const isPlaying = ref<boolean>(false);
@@ -25,195 +26,196 @@ const isVideoFile = ref<boolean>(false);
 const audioElement = ref<HTMLAudioElement>();
 
 const { getSpeakerColor } = useSpeakerColor(
-  computed(() => Array.from(getUniqueSpeakers(segments.value))),
+    computed(() => Array.from(getUniqueSpeakers(segments.value))),
 );
 const { registerHandler, unregisterHandler } = useCommandBus();
 
 const currentTime = defineModel<number>({ default: 0 });
 
 onMounted(() => {
-  registerHandler(Cmds.SeekToSecondsCommand, handleSeekToSeconds);
-  registerHandler(Cmds.TogglePlayCommand, handleTooglePlayCommand);
+    registerHandler(Cmds.SeekToSecondsCommand, handleSeekToSeconds);
+    registerHandler(Cmds.TogglePlayCommand, handleTooglePlayCommand);
 });
 
 onUnmounted(() => {
-  unregisterHandler(Cmds.SeekToSecondsCommand, handleSeekToSeconds);
-  unregisterHandler(Cmds.TogglePlayCommand, handleTooglePlayCommand);
+    unregisterHandler(Cmds.SeekToSecondsCommand, handleSeekToSeconds);
+    unregisterHandler(Cmds.TogglePlayCommand, handleTooglePlayCommand);
 });
 
 // Function to check if the file is a video
 const checkIfVideoFile = (file: Blob): boolean => {
-  // Check if the MIME type starts with 'video/'
-  return file.type.startsWith("video/");
+    // Check if the MIME type starts with 'video/'
+    return file.type.startsWith("video/");
 };
 
 // Function to get currently visible segments based on current time
 const currentSegments = computed(() => {
-  // Return segments that include the current time
-  return segments.value.filter(
-    (segment) =>
-      currentTime.value >= segment.start &&
-      currentTime.value < segment.end,
-  );
+    // Return segments that include the current time
+    return segments.value.filter(
+        (segment) =>
+            currentTime.value >= segment.start &&
+            currentTime.value < segment.end,
+    );
 });
 
 async function handleTooglePlayCommand(_: TogglePlayCommand) {
-  togglePlay();
+    togglePlay();
 }
 
 /**
  * Toggles audio playback
  */
 const togglePlay = (): void => {
-  if (videoElement.value) {
-    if (isPlaying.value) {
-      videoElement.value.pause();
-    } else {
-      videoElement.value.play();
+    if (videoElement.value) {
+        if (isPlaying.value) {
+            videoElement.value.pause();
+        } else {
+            videoElement.value.play();
+        }
+    } else if (audioElement.value) {
+        if (isPlaying.value) {
+            audioElement.value.pause();
+        } else {
+            audioElement.value.play();
+        }
     }
-  } else if (audioElement.value) {
-    if (isPlaying.value) {
-      audioElement.value.pause();
-    } else {
-      audioElement.value.play();
-    }
-  }
 
-  isPlaying.value = !isPlaying.value;
+    isPlaying.value = !isPlaying.value;
 };
 
 watch(
-  () => transcriptionStore.currentTranscription,
-  (currentTranscription) => {
-    if (!currentTranscription?.mediaFile) {
-      return;
-    }
-
-    mediaFile.value = currentTranscription.mediaFile;
-    mediaSrc.value = URL.createObjectURL(mediaFile.value);
-
-    // Update segments and check if media is video
-    segments.value = currentTranscription.segments ?? [];
-    isVideoFile.value = checkIfVideoFile(currentTranscription.mediaFile);
-
-    isPlaying.value = false;
-  },
-  { immediate: true },
+    () => props.transcription,
+    (currentTranscription) => {
+        if (!currentTranscription?.mediaFile) {
+            return;
+        }
+
+        mediaFile.value = currentTranscription.mediaFile;
+        mediaSrc.value = URL.createObjectURL(mediaFile.value);
+
+        // Update segments and check if media is video
+        segments.value = currentTranscription.segments ?? [];
+        isVideoFile.value = checkIfVideoFile(currentTranscription.mediaFile);
+
+        isPlaying.value = false;
+    },
+    { immediate: true },
 );
 
 const seekTo = (time: number): void => {
-  if (audioElement.value && audioElement.value.currentTime !== time) {
-    audioElement.value.currentTime = time;
-  } else if (videoElement.value && videoElement.value.currentTime !== time) {
-    videoElement.value.currentTime = time;
-  }
+    if (audioElement.value && audioElement.value.currentTime !== time) {
+        audioElement.value.currentTime = time;
+    } else if (videoElement.value && videoElement.value.currentTime !== time) {
+        videoElement.value.currentTime = time;
+    }
 
-  currentTime.value = time;
+    currentTime.value = time;
 };
 
 function onTimeUpdate(): void {
-  if (videoElement.value) {
-    currentTime.value = videoElement.value.currentTime;
-  } else if (audioElement.value) {
-    currentTime.value = audioElement.value.currentTime;
-  }
+    if (videoElement.value) {
+        currentTime.value = videoElement.value.currentTime;
+    } else if (audioElement.value) {
+        currentTime.value = audioElement.value.currentTime;
+    }
 }
 
 async function handleSeekToSeconds(
-  command: SeekToSecondsCommand,
+    command: SeekToSecondsCommand,
 ): Promise<void> {
-  seekTo(command.seconds);
+    seekTo(command.seconds);
 }
 </script>
 
 <template>
-  <div class="media-container">
-    <!-- Show video if it's a video file -->
-    <video v-if="isVideoFile && mediaFile" ref="videoElement" class="media-player" @timeupdate="onTimeUpdate"
-      @click="togglePlay">
-      <source :src="mediaSrc" type="video/mp4">
-    </video>
-
-    <!-- Show audio visualization if it's not a video file -->
-    <div v-else class="audio-bar">
-      <!-- Audio element with references for control -->
-      <audio ref="audioElement" :src="mediaSrc" @timeupdate="onTimeUpdate" />
-    </div>
-
-    <!-- Subtitles section - now positioned at the bottom of the media -->
-    <div class="subtitles-container">
-      <div v-for="segment in currentSegments" :key="segment.id" class="subtitle-segment" :style="{
-        '--text-color': getSpeakerColor(
-          segment.speaker ?? 'unknown',
-        ).toString(),
-      }">
-        <span class="font-bold">{{ segment.speaker }}: </span>
-        <span>{{ segment.text }}</span>
-      </div>
+    <div class="media-container">
+        <!-- Show video if it's a video file -->
+        <!-- biome-ignore lint/a11y/useMediaCaption: User-uploaded media may not have captions -->
+        <video v-if="isVideoFile && mediaFile" ref="videoElement" class="media-player" @timeupdate="onTimeUpdate"
+            @click="togglePlay">
+            <source :src="mediaSrc" type="video/mp4">
+        </video>
+
+        <!-- Show audio visualization if it's not a video file -->
+        <div v-else class="audio-bar">
+            <!-- Audio element with references for control -->
+            <audio ref="audioElement" :src="mediaSrc" @timeupdate="onTimeUpdate" />
+        </div>
+
+        <!-- Subtitles section - now positioned at the bottom of the media -->
+        <div class="subtitles-container">
+            <div v-for="segment in currentSegments" :key="segment.id" class="subtitle-segment" :style="{
+                '--text-color': getSpeakerColor(
+                    segment.speaker ?? 'unknown',
+                ).toString(),
+            }">
+                <span class="font-bold">{{ segment.speaker }}: </span>
+                <span>{{ segment.text }}</span>
+            </div>
+        </div>
     </div>
-  </div>
-  <!-- Playback controls -->
-  <div class="controls flex gap-2 items-center my-3">
-    <UButton @click="togglePlay">
-      {{ isPlaying ? t('media.pause') : t('media.play') }}
-    </UButton>
-
-    <USlider v-model="currentTime" :min="0" :max="props.duration" :step="0.1"
-      @update:model-value="(v) => seekTo(v as number)" />
-    <div class="w-[100px]">
-      {{ formatTime(currentTime, { milliseconds: false }) }} /
-      {{
-        formatTime(props.duration, {
-          milliseconds: false,
-        })
-      }}
+    <!-- Playback controls -->
+    <div class="controls flex gap-2 items-center my-3">
+        <UButton @click="togglePlay">
+            {{ isPlaying ? t('media.pause') : t('media.play') }}
+        </UButton>
+
+        <USlider v-model="currentTime" :min="0" :max="props.duration" :step="0.1"
+            @update:model-value="(v) => seekTo(v as number)" />
+        <div class="w-[100px]">
+            {{ formatTime(currentTime, { milliseconds: false }) }} /
+            {{
+                formatTime(props.duration, {
+                    milliseconds: false,
+                })
+            }}
+        </div>
     </div>
-  </div>
 </template>
 
 <style lang="scss">
 .media-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  margin: 0 auto;
-  position: relative;
-  /* Add position relative to contain absolute positioned children */
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    margin: 0 auto;
+    position: relative;
+    /* Add position relative to contain absolute positioned children */
 }
 
 .media-player {
-  width: 100%;
-  border-radius: 4px;
+    width: 100%;
+    border-radius: 4px;
 }
 
 .audio-bar {
-  width: 100%;
-  height: 100px;
+    width: 100%;
+    height: 100px;
 }
 
 .subtitles-container {
-  position: absolute;
-  /* Position absolutely to overlay on video/audio */
-  bottom: 10px;
-  /* Position at the bottom with small margin */
-  left: 0;
-  right: 0;
-  background-color: rgba(177, 177, 177, 0.9);
-  border-radius: 4px;
-  padding: 12px;
-  min-height: 40px;
-  /* Reduced min-height for more compact appearance */
-  z-index: 10;
-  /* Ensure subtitles appear above the video */
-  margin: 0 auto;
-  /* Center horizontally */
-  max-width: 90%;
-  /* Add some side margins */
+    position: absolute;
+    /* Position absolutely to overlay on video/audio */
+    bottom: 10px;
+    /* Position at the bottom with small margin */
+    left: 0;
+    right: 0;
+    background-color: rgba(177, 177, 177, 0.9);
+    border-radius: 4px;
+    padding: 12px;
+    min-height: 40px;
+    /* Reduced min-height for more compact appearance */
+    z-index: 10;
+    /* Ensure subtitles appear above the video */
+    margin: 0 auto;
+    /* Center horizontally */
+    max-width: 90%;
+    /* Add some side margins */
 }
 
 .subtitle-segment {
-  font-size: 20px;
-  color: var(--text-color);
-  -webkit-text-stroke: 0.5px #313131;
+    font-size: 20px;
+    color: var(--text-color);
+    -webkit-text-stroke: 0.5px #313131;
 }
 </style>
diff --git a/app/components/transcription/ProcessingTasksTable.vue b/app/components/transcription/ProcessingTasksTable.vue
new file mode 100644
index 0000000..1b1bbce
--- /dev/null
+++ b/app/components/transcription/ProcessingTasksTable.vue
@@ -0,0 +1,128 @@
+<script lang="ts" setup>
+import type { StoredTask } from "~/types/task";
+import { TaskStatusEnum } from "~/types/task";
+
+const props = defineProps<{
+    tasks: StoredTask[];
+    loading: boolean;
+    error?: string;
+}>();
+
+const emit = defineEmits<{
+    refresh: [];
+    "dismiss-error": [];
+}>();
+
+const { t } = useI18n();
+const { formatDate } = useDateFormatter();
+const { getStatusDisplay, getStatusColor, computeTaskProgress } = useTaskStatus();
+
+const columns = [
+    {
+        accessorKey: "mediaFileName",
+        header: t("processing.table.fileName"),
+        enableSorting: true,
+        enableResizing: true,
+        size: 200,
+        maxSize: 300,
+    },
+    {
+        accessorKey: "createdAt",
+        header: t("processing.table.createdAt"),
+        enableResizing: true,
+        enableSorting: true,
+        cell: (opts: unknown) => {
+            const row = (
+                opts as { row: { getValue: (key: string) => unknown } }
+            ).row;
+            const createdAt = row.getValue("createdAt") as number;
+            return formatDate(createdAt);
+        },
+    },
+    {
+        accessorKey: "status",
+        header: t("processing.table.status"),
+        enableSorting: true,
+        enableResizing: true,
+    },
+];
+</script>
+
+<template>
+    <div v-if="props.tasks.length > 0" class="space-y-6 mb-8">
+        <div class="flex justify-between items-center">
+            <div>
+                <h2 class="text-xl font-bold">
+                    {{ t("processing.title") }}
+                </h2>
+                <p class="text-gray-600 mt-1">
+                    {{ t("processing.description") }}
+                </p>
+            </div>
+            <UButton
+                icon="i-lucide-loader-circle"
+                :loading="props.loading"
+                @click="emit('refresh')"
+            >
+                {{ t("processing.refresh") }}
+            </UButton>
+        </div>
+
+        <UAlert
+            v-if="props.error"
+            icon="i-lucide-triangle-alert"
+            color="error"
+            variant="soft"
+            :title="t('processing.errors.title')"
+            :description="props.error"
+            @dismiss="emit('dismiss-error')"
+        />
+
+        <UTable
+            :columns="columns"
+            :data="props.tasks"
+            sticky
+            :loading="props.loading"
+            :empty-state="{
+                icon: 'i-lucide-clock',
+                label: t('processing.noTasksFound'),
+                description: t('processing.noTasksDescription'),
+            }"
+            :sorting-options="{ enableSorting: true }"
+        >
+            <template #mediaFileName-cell="{ row }">
+                <div class="font-medium text-wrap">
+                    {{
+                        row.original.mediaFileName ||
+                        t("processing.unknownFile")
+                    }}
+                </div>
+            </template>
+
+            <template #status-cell="{ row }">
+                <div class="flex items-center gap-2">
+                    <UBadge
+                        :color="getStatusColor(row.original.status.status)"
+                        variant="subtle"
+                    >
+                        {{ getStatusDisplay(row.original.status.status) }}
+                    </UBadge>
+                    <template
+                        v-if="
+                            row.original.status.status ===
+                            TaskStatusEnum.IN_PROGRESS
+                        "
+                    >
+                        <UIcon
+                            name="i-lucide-cog"
+                            class="animate-spin text-blue-600"
+                        />
+                        <span class="text-sm text-blue-600">
+                            ({{ Math.round(computeTaskProgress(row.original.status) * 100) }}%)
+                        </span>
+                    </template>
+                </div>
+            </template>
+        </UTable>
+    </div>
+</template>
diff --git a/app/components/transcription/TranscriptionTable.vue b/app/components/transcription/TranscriptionTable.vue
new file mode 100644
index 0000000..e8bd917
--- /dev/null
+++ b/app/components/transcription/TranscriptionTable.vue
@@ -0,0 +1,96 @@
+<script lang="ts" setup>
+import type { StoredTranscription } from "~/types/storedTranscription";
+
+const props = defineProps<{
+    transcriptions?: StoredTranscription[];
+}>();
+
+const emit = defineEmits<{
+    delete: [id: string];
+}>();
+
+const { t } = useI18n();
+const { formatDate } = useDateFormatter();
+const { openDialog } = useDialog();
+
+const columns = [
+    {
+        accessorKey: "name",
+        header: t("transcription.table.name"),
+        enableSorting: true,
+        enableResizing: true,
+        size: 200,
+        maxSize: 300,
+    },
+    {
+        accessorKey: "createdAt",
+        header: t("transcription.table.createdAt"),
+        enableResizing: true,
+        enableSorting: true,
+        cell: (props: { row: { original: StoredTranscription } }) => {
+            return formatDate(props.row.original.createdAt);
+        },
+    },
+    {
+        accessorKey: "updatedAt",
+        header: t("transcription.table.updatedAt"),
+        enableSorting: true,
+        enableResizing: true,
+        cell: (opts: unknown) => {
+            const row = (
+                opts as { row: { getValue: (key: string) => unknown } }
+            ).row;
+            return formatDate(row.getValue("updatedAt") as number);
+        },
+    },
+    {
+        accessorKey: "actions",
+        header: "",
+    },
+];
+
+function handleDeleteClick(transcriptionId: string): void {
+    openDialog({
+        title: t("transcription.delete.title"),
+        message: t("transcription.delete.confirmation"),
+        onSubmit: () => emit("delete", transcriptionId),
+    });
+}
+</script>
+
+<template>
+    <UTable
+        :columns="columns"
+        :data="props.transcriptions"
+        sticky
+        :empty-state="{
+            icon: 'i-lucide-file-text',
+            label: t('transcription.noTranscriptionsFound'),
+            description: t('ui.emptyState.description'),
+        }"
+        :sorting-options="{ enableSorting: true }"
+    >
+        <template #name-cell="{ row }">
+            <div class="font-bold text-wrap">
+                {{ row.original.name }}
+            </div>
+        </template>
+
+        <template #actions-cell="{ row }">
+            <div class="flex gap-2 justify-end">
+                <ULink :to="`transcription/${row.original.id}`">
+                    <UButton icon="i-lucide-pencil" color="primary">
+                        {{ t("transcription.actions.edit") }}
+                    </UButton>
+                </ULink>
+                <UButton
+                    icon="i-lucide-trash-2"
+                    color="error"
+                    @click="handleDeleteClick(row.original.id)"
+                >
+                    {{ t("transcription.actions.delete") }}
+                </UButton>
+            </div>
+        </template>
+    </UTable>
+</template>
diff --git a/app/components/transcriptionList/TranscriptionList.vue b/app/components/transcriptionList/TranscriptionList.vue
index 928f7f9..deaef0f 100644
--- a/app/components/transcriptionList/TranscriptionList.vue
+++ b/app/components/transcriptionList/TranscriptionList.vue
@@ -1,13 +1,171 @@
 <script lang="ts" setup>
+import { motion } from "motion-v";
+import { v4 as uuid } from "uuid";
+import { AddSegmentCommand, InsertSegmentCommand } from "~/types/commands";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import type { SegmentWithId } from "~/types/transcriptionResponse";
 import TranscriptionListItem from "./TranscriptionSegmentEdit.vue";
 
-const { segments, speakers } = useCurrentTranscription();
+interface InputProps {
+    transcription: StoredTranscription;
+    currentTime?: number;
+    autoScrollEnabled?: boolean;
+}
+
+const props = withDefaults(defineProps<InputProps>(), {
+    currentTime: 0,
+    autoScrollEnabled: true,
+});
+
+const { executeCommand } = useCommandBus();
+
+const listContainer = ref<HTMLElement>();
+const segmentRefs = ref<Map<string, HTMLElement>>(new Map());
+
+const segments = computed(() =>
+    props.transcription.segments.toSorted((a, b) => a.start - b.start),
+);
+const speakers = computed(() =>
+    Array.from(getUniqueSpeakers(props.transcription.segments)),
+);
+
+const throttledProgress = ref(0);
+let progressTimeout: ReturnType<typeof setTimeout> | undefined;
+
+onUnmounted(() => {
+    if (progressTimeout) {
+        clearTimeout(progressTimeout);
+    }
+});
+
+const currentSegmentId = computed(() => {
+    const current = segments.value.find(
+        (segment) =>
+            props.currentTime >= segment.start &&
+            props.currentTime < segment.end,
+    );
+    return current?.id;
+});
+
+const activeSegemntProgress = computed(() => {
+    const current = segments.value.find(
+        (segment) => segment.id === currentSegmentId.value,
+    );
+    if (!current) {
+        return 0;
+    }
+
+    return (props.currentTime - current.start) / (current.end - current.start);
+});
+
+watch(
+    activeSegemntProgress,
+    (newProgress) => {
+        if (progressTimeout) {
+            return;
+        }
+
+        throttledProgress.value = newProgress;
+        progressTimeout = setTimeout(() => {
+            progressTimeout = undefined;
+        }, 300);
+    },
+    { immediate: true },
+);
+
+function setSegmentRef(id: string, el: unknown): void {
+    if (!el) {
+        return;
+    }
+
+    if (el instanceof HTMLElement) {
+        segmentRefs.value.set(id, el);
+    } else {
+        console.warn(
+            `Attempted to set segment ref for ID ${id} with a non-HTMLElement`,
+            el,
+        );
+    }
+}
+
+function isSegmentActive(segmentId: string): boolean {
+    return currentSegmentId.value === segmentId;
+}
+
+watch(currentSegmentId, (newId, oldId) => {
+    if (
+        !props.autoScrollEnabled ||
+        !newId ||
+        !listContainer.value ||
+        newId === oldId
+    ) {
+        return;
+    }
+
+    const segmentEl = segmentRefs.value.get(newId);
+    if (!segmentEl) {
+        console.warn(`No element found for segment ID: ${newId}`);
+        return;
+    }
+
+    segmentEl.scrollIntoView({ behavior: "smooth", block: "center" });
+});
+
+async function addSegmentAfter(segment: SegmentWithId) {
+    executeCommand(new InsertSegmentCommand(segment.id, {}, "after"));
+}
+
+async function addSegemntAtZero() {
+    const segment: SegmentWithId = {
+        id: uuid(),
+        text: "",
+        start: 0,
+        end: 2,
+        speaker: speakers.value[0],
+    };
+    executeCommand(new AddSegmentCommand(segment));
+}
 </script>
 
 <template>
-    <div class="flex flex-col gap-4">
-        <div v-for="segment in segments" :key="segment.text + segment.start">
-            <TranscriptionListItem :segment="segment" :speakers="speakers" />
-        </div>
+    <div ref="listContainer" class="flex flex-col">
+        <USeparator id="add-transcription-top">
+            <UButton
+                icon="i-lucide-plus"
+                variant="link"
+                color="neutral"
+                @click="() => addSegemntAtZero()"
+            />
+        </USeparator>
+
+        <AnimatePresence>
+            <div id="transcription-segments">
+                <motion.div
+                    v-for="segment in segments"
+                    :key="segment.id"
+                    :initial="{ opacity: 0, scaleY: 0 }"
+                    :animate="{ opacity: 1, scaleY: 1 }"
+                    :exit="{ scale: 0 }"
+                >
+                    <div :ref="(el) => setSegmentRef(segment.id, el)">
+                        <TranscriptionListItem
+                            :segment="segment"
+                            :speakers="speakers"
+                            :isActive="isSegmentActive(segment.id)"
+                            :currentTime="props.currentTime"
+                        />
+                    </div>
+
+                    <USeparator>
+                        <UButton
+                            icon="i-lucide-plus"
+                            variant="link"
+                            color="neutral"
+                            @click="() => addSegmentAfter(segment)"
+                        />
+                    </USeparator>
+                </motion.div>
+            </div>
+        </AnimatePresence>
     </div>
 </template>
diff --git a/app/components/transcriptionList/TranscriptionSegmentEdit.vue b/app/components/transcriptionList/TranscriptionSegmentEdit.vue
index de09a69..31a4c28 100644
--- a/app/components/transcriptionList/TranscriptionSegmentEdit.vue
+++ b/app/components/transcriptionList/TranscriptionSegmentEdit.vue
@@ -1,25 +1,32 @@
 <script lang="ts" setup>
+import { motion } from "motion-v";
+import type { WatchHandle } from "vue";
 import { UCard, UTextarea } from "#components";
 import {
-    DeleteSegementCommand,
-    InsertSegementCommand,
+    DeleteSegmentCommand,
     SeekToSecondsCommand,
-    UpdateSegementCommand,
+    UpdateSegmentCommand,
 } from "~/types/commands";
-import type { SegementWithId } from "~/types/transcriptionResponse";
+import type { SegmentWithId } from "~/types/transcriptionResponse";
 import { formatTime } from "~/utils/time";
 
 interface TranscriptionListProps {
-    segment: SegementWithId;
+    segment: SegmentWithId;
     speakers: string[];
+    isActive?: boolean;
+    currentTime: number;
 }
 
 const props = defineProps<TranscriptionListProps>();
 
+const MotionCard = motion.create(UCard);
+
 const { executeCommand } = useCommandBus();
-const internalSegment = ref<SegementWithId>({ ...props.segment });
+const internalSegment = ref<SegmentWithId>({ ...props.segment });
 const isDirty = ref(false);
 const { t } = useI18n();
+const progress = ref(0);
+const duration = ref(0);
 
 watch(
     () => props.segment,
@@ -46,16 +53,21 @@ watch(
     { deep: true },
 );
 
-function removeSegment(segment: SegementWithId): void {
-    executeCommand(new DeleteSegementCommand(segment.id));
-}
+let unsubsribe: WatchHandle | undefined ;
 
-function addSegmentAfter(segment: SegementWithId): void {
-    executeCommand(new InsertSegementCommand(segment.id, {}, "after"));
-}
+watch(() => props.isActive, () => {
+    if (props.isActive) {
+        unsubsribe = watch(() => props.currentTime, (tNew, tOld) => {
+            progress.value = (tNew - internalSegment.value.start) / (internalSegment.value.end - internalSegment.value.start);
+            duration.value = Math.abs(tNew - tOld);
+        });
+    } else if (unsubsribe) {
+        unsubsribe();
+    }
+}, { immediate: true });
 
-function addSegmentBefore(segment: SegementWithId): void {
-    executeCommand(new InsertSegementCommand(segment.id, {}, "before"));
+function removeSegment(segment: SegmentWithId): void {
+    executeCommand(new DeleteSegmentCommand(segment.id));
 }
 
 function seekTo(time: number): void {
@@ -76,11 +88,11 @@ function applyChanges(): void {
             }
             return acc;
         },
-        {} as Partial<SegementWithId>,
+        {} as Partial<SegmentWithId>,
     );
 
     executeCommand(
-        new UpdateSegementCommand(internalSegment.value.id, updates),
+        new UpdateSegmentCommand(internalSegment.value.id, updates),
     );
 }
 
@@ -129,101 +141,67 @@ const endTimeFormatted = computed({
 </script>
 
 <template>
-    <UCard>
-        <UAlert
-            v-if="isDirty"
-            title=""
-            :description="t('transcription.applySpeakerChanges')"
-            color="info"
-            variant="outline"
-            :actions="[
-                {
-                    label: t('transcription.undoChanges'),
-                    onClick: unDoChanges,
-                },
-                {
-                    label: t('transcription.applyChanges'),
-                    color: 'neutral',
-                    variant: 'subtle',
-                    onClick: applyChanges,
-                },
-            ]"
-        />
-        <UTextarea
-            v-model="internalSegment.text"
-            class="w-full"
-            @keydown="handleKeydown"
-        />
-
-        <div
-            class="flex justify-between gap-2 pt-2 flex-wrap"
-            @keydown="handleKeydown"
-        >
-            <USelectMenu
-                v-model="internalSegment.speaker"
-                :items="props.speakers"
-                create-item
-                :placeholder="t('transcription.placeholderSpeakerName')"
-                @create="handleCreateSpeaker"
-            />
-
-            <div class="flex gap-2 items-center">
-                <UInput
-                    v-model="startTimeFormatted"
-                    type="number"
-                    class="w-[100px]"
-                    :step="0.1"
-                    @keydown="handleKeydown"
-                >
-                    <template #trailing>
-                        <span class="text-xs">s</span>
-                    </template>
-                </UInput>
-                <a @click="() => seekTo(internalSegment.start)">
-                    {{ formatTime(internalSegment.start) }}
-                </a>
-                -
-                <a @click="() => seekTo(internalSegment.end)">{{
-                    formatTime(internalSegment.end)
-                }}</a>
-                <UInput
-                    v-model="endTimeFormatted"
-                    type="number"
-                    class="w-[100px]"
-                    :step="0.1"
-                    @keydown="handleKeydown"
-                >
-                    <template #trailing>
-                        <span class="text-xs">s</span>
-                    </template>
-                </UInput>
-            </div>
-
-            <div class="flex gap-2">
-                <UTooltip :text="t('help.segments.insertBefore')">
-                    <UButton
-                        color="primary"
-                        icon="i-lucide-move-up"
-                        @click="addSegmentBefore(internalSegment)"
-                    />
-                </UTooltip>
-                <UTooltip :text="t('help.segments.insertAfter')">
-                    <UButton
-                        color="primary"
-                        icon="i-lucide-move-down"
-                        @click="addSegmentAfter(internalSegment)"
-                    />
-                </UTooltip>
-                <UTooltip :text="t('help.segments.deleteSegment')">
-                    <UButton
-                        color="error"
-                        icon="i-lucide-trash-2"
-                        @click="removeSegment(internalSegment)"
-                    />
-                </UTooltip>
+    <MotionCard layout variant="subtle" :ui="{
+        root: props.isActive
+            ? 'ring-2 ring-teal-500'
+            : ''
+    }" class="relative overflow-hidden">
+        <motion.div v-if="props.isActive" :initial="{ scaleX: 0 }" :animate="{ scaleX: progress }"
+            :transition="{ duration: duration, ease: 'linear' }"
+            class="absolute inset-0 origin-left pointer-events-none z-0"
+            style="background: linear-gradient(to right, rgba(20, 184, 166, 0.15), rgba(20, 184, 166, 0.25));" />
+        <div class="relative z-10">
+            <UAlert v-if="isDirty" title="" :description="t('transcription.applySpeakerChanges')" color="info"
+                variant="outline" :actions="[
+                    {
+                        label: t('transcription.undoChanges'),
+                        onClick: unDoChanges,
+                    },
+                    {
+                        label: t('transcription.applyChanges'),
+                        color: 'neutral',
+                        variant: 'subtle',
+                        onClick: applyChanges,
+                    },
+                ]" />
+            <UTextarea v-model="internalSegment.text" class="w-full" @keydown="handleKeydown" />
+
+            <div class="flex justify-between gap-2 pt-2 flex-wrap" @keydown="handleKeydown">
+                <USelectMenu v-model="internalSegment.speaker" :items="props.speakers" create-item
+                    :placeholder="t('transcription.placeholderSpeakerName')" @create="handleCreateSpeaker" />
+
+                <div class="flex gap-2 items-center">
+                    <UInput v-model="startTimeFormatted" type="number" class="w-[100px]" :step="0.1"
+                        @keydown="handleKeydown">
+                        <template #trailing>
+                            <span class="text-xs">s</span>
+                        </template>
+                    </UInput>
+                    <div class="text-gray-700">
+                        <a @click="() => seekTo(internalSegment.start)">
+                            {{ formatTime(internalSegment.start) }}
+                        </a>
+                        -
+                        <a @click="() => seekTo(internalSegment.end)">{{
+                            formatTime(internalSegment.end)
+                        }}</a>
+                    </div>
+                    <UInput v-model="endTimeFormatted" type="number" class="w-[100px]" :step="0.1"
+                        @keydown="handleKeydown">
+                        <template #trailing>
+                            <span class="text-xs">s</span>
+                        </template>
+                    </UInput>
+                </div>
+
+                <div class="flex gap-2">
+                    <UTooltip :text="t('help.segments.deleteSegment')">
+                        <UButton color="error" icon="i-lucide-trash-2" @click="removeSegment(internalSegment)" />
+                    </UTooltip>
+                </div>
             </div>
         </div>
-    </UCard>
+    </MotionCard>
 </template>
 
 <style lang="scss" scoped>
diff --git a/app/composables/audio_convertion.ts b/app/composables/audio_convertion.ts
index fa3891c..4fbe068 100644
--- a/app/composables/audio_convertion.ts
+++ b/app/composables/audio_convertion.ts
@@ -1,7 +1,7 @@
 import { FFmpeg } from "@ffmpeg/ffmpeg";
 import { fetchFile } from "@ffmpeg/util";
 
-export function useAudioConvertion() {
+export function useAudioConversion() {
     const ffmpeg = new FFmpeg();
 
     const loadPromise = ffmpeg.load();
diff --git a/app/composables/currentTranscription.ts b/app/composables/currentTranscription.ts
deleted file mode 100644
index fcc82fe..0000000
--- a/app/composables/currentTranscription.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-export const useCurrentTranscription = () => {
-    const store = useTranscriptionsStore();
-
-    const currentTranscription = shallowRef(store.currentTranscription);
-    const segments = shallowRef(store.currentTranscription?.segments ?? []);
-
-    const speakers = computed(() =>
-        Array.from(getUniqueSpeakers(segments.value)),
-    );
-
-    watch(
-        () => store.currentTranscription,
-        () => {
-            currentTranscription.value = store.currentTranscription;
-            segments.value = store.currentTranscription?.segments ?? [];
-        },
-    );
-
-    return { currentTranscription, segments, speakers };
-};
diff --git a/app/composables/export.ts b/app/composables/export.ts
index d94daa0..d5c1b96 100644
--- a/app/composables/export.ts
+++ b/app/composables/export.ts
@@ -1,28 +1,27 @@
 // Import the StoredTranscription interface
-import type { SegementWithId } from "~/types/transcriptionResponse";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import type { SegmentWithId } from "~/types/transcriptionResponse";
 
 export interface ExportOptions {
+    transcription: StoredTranscription;
     withSpeakers: boolean;
     withTimestamps: boolean;
     mergeSegments: boolean; // Only applies to text exports
     withSummary: boolean; // Only applies to text exports
 }
 
-export const useExport = () => {
-    const { currentTranscription } = useCurrentTranscription();
-    const logger = useLogger();
-
+export function useExport() {
     /**
      * Merges consecutive segments from the same speaker into single segments
      * @param segments - Array of segments to merge
      * @returns Array of merged segments
      */
     function mergeConsecutiveSegments(
-        segments: SegementWithId[],
-    ): SegementWithId[] {
+        segments: SegmentWithId[],
+    ): SegmentWithId[] {
         if (segments.length === 0) return [];
 
-        const merged: SegementWithId[] = [];
+        const merged: SegmentWithId[] = [];
         let currentSegment = { ...segments[0] };
 
         for (let i = 1; i < segments.length; i++) {
@@ -39,23 +38,18 @@ export const useExport = () => {
                 currentSegment.end = nextSegment.end;
             } else {
                 // Different speaker, save current and start new
-                merged.push(currentSegment as SegementWithId);
+                merged.push(currentSegment as SegmentWithId);
                 currentSegment = { ...nextSegment };
             }
         }
 
         // Don't forget the last segment
-        merged.push(currentSegment as SegementWithId);
+        merged.push(currentSegment as SegmentWithId);
         return merged;
     }
 
     function exportAsText(options: ExportOptions) {
-        if (!currentTranscription.value) {
-            logger.error("No current transcription available for export.");
-            return;
-        }
-
-        let segments = currentTranscription.value.segments;
+        let segments = options.transcription.segments;
 
         // Merge segments if requested
         if (options.mergeSegments) {
@@ -93,16 +87,16 @@ export const useExport = () => {
         let finalText = transcriptText;
 
         // Add summary if requested
-        if (options.withSummary && currentTranscription.value?.summary) {
+        if (options.withSummary && options.transcription.summary) {
             // Use the stored summary
-            finalText = `MEETING SUMMARY:\n${currentTranscription.value.summary}\n\n---\n\nFULL TRANSCRIPT:\n${transcriptText}`;
+            finalText = `MEETING SUMMARY:\n${options.transcription.summary}\n\n---\n\nFULL TRANSCRIPT:\n${transcriptText}`;
         }
 
         const blob = new Blob([finalText], { type: "text/plain" });
         const url = URL.createObjectURL(blob);
         const a = document.createElement("a");
         a.href = url;
-        a.download = `${currentTranscription.value?.name}.txt`;
+        a.download = `${options.transcription.name}.txt`;
         a.click();
         URL.revokeObjectURL(url);
     }
@@ -121,13 +115,11 @@ export const useExport = () => {
         return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")},${milliseconds.toString().padStart(3, "0")}`;
     }
 
-    function exportAsSrt(withSpeakers: boolean) {
-        if (!currentTranscription.value) {
-            logger.error("No current transcription available for export.");
-            return;
-        }
-
-        const srt = currentTranscription.value.segments
+    function exportAsSrt(
+        transciption: StoredTranscription,
+        withSpeakers: boolean,
+    ) {
+        const srt = transciption.segments
             .map((s, i) => {
                 const start = srtFormatTime(s.start);
                 const end = srtFormatTime(s.end);
@@ -139,7 +131,7 @@ export const useExport = () => {
         const url = URL.createObjectURL(blob);
         const a = document.createElement("a");
         a.href = url;
-        a.download = `${currentTranscription.value.name}.srt`;
+        a.download = `${transciption.name}.srt`;
         a.click();
         URL.revokeObjectURL(url);
     }
@@ -148,19 +140,14 @@ export const useExport = () => {
      * Exports the current transcription as a json file
      * This format preserves all transcription data including metadata
      */
-    function exportAsJson(): void {
-        if (!currentTranscription.value) {
-            logger.error("No current transcription available for export.");
-            return;
-        }
-
+    function exportAsJson(transciption: StoredTranscription): void {
         // Create a serializable object with all transcription data
         const exportData = {
-            name: currentTranscription.value.name,
-            segments: currentTranscription.value.segments,
-            audioFileId: currentTranscription.value.audioFileId,
-            createdAt: currentTranscription.value.createdAt,
-            mediaFileName: currentTranscription.value.mediaFileName,
+            name: transciption.name,
+            segments: transciption.segments,
+            audioFileId: transciption.audioFileId,
+            createdAt: transciption.createdAt,
+            mediaFileName: transciption.mediaFileName,
             version: "1.0.0", // Adding version for future compatibility
         };
 
@@ -176,7 +163,61 @@ export const useExport = () => {
         const url = URL.createObjectURL(blob);
         const a = document.createElement("a");
         a.href = url;
-        a.download = `${currentTranscription.value.name}.json`;
+        a.download = `${transciption.name}.json`;
+        a.click();
+        URL.revokeObjectURL(url);
+    }
+
+    async function exportAsDocx(options: ExportOptions) {
+        let segments = options.transcription.segments;
+
+        if (options.mergeSegments) {
+            segments = mergeConsecutiveSegments(segments);
+        }
+
+        const transcriptMarkdown = segments
+            .map((s) => {
+                let line = "";
+
+                if (options.withTimestamps) {
+                    line += `*[${formatTime(s.start)} - ${formatTime(s.end)}]* `;
+                }
+
+                if (options.withSpeakers) {
+                    line += `**${s.speaker}:** `;
+                }
+
+                line += s.text;
+                return line;
+            })
+            .join("\n\n");
+
+        let markdown = `# ${options.transcription.name}\n\n`;
+
+        if (options.withSummary && options.transcription.summary) {
+            markdown += `## Meeting Summary\n\n${options.transcription.summary}\n\n---\n\n`;
+        }
+
+        markdown += `## Transcript\n\n${transcriptMarkdown}`;
+
+        const blob = await markdownToDocx(markdown);
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement("a");
+        a.href = url;
+        a.download = `${options.transcription.name}.docx`;
+        a.click();
+        URL.revokeObjectURL(url);
+    }
+
+    async function exportSummaryAsDocx(transciption: StoredTranscription) {
+        if (!transciption.summary) return;
+
+        const markdown = `# ${transciption.name}\n\n${transciption.summary}`;
+        const blob = await markdownToDocx(markdown);
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement("a");
+        a.href = url;
+        a.download = `${transciption.name}-summary.docx`;
         a.click();
         URL.revokeObjectURL(url);
     }
@@ -185,5 +226,7 @@ export const useExport = () => {
         exportAsText,
         exportAsSrt,
         exportAsJson,
+        exportAsDocx,
+        exportSummaryAsDocx,
     };
-};
+}
diff --git a/app/composables/transcriptionService.ts b/app/composables/transcriptionService.ts
index 3d15c13..73132b3 100644
--- a/app/composables/transcriptionService.ts
+++ b/app/composables/transcriptionService.ts
@@ -1,240 +1,232 @@
 import { v4 as uuid } from "uuid";
-import type {
-    InsertSegementCommand,
-    RenameSpeakerCommand,
-} from "~/types/commands";
 import {
     type AddSegmentCommand,
     Cmds,
-    DeleteSegementCommand,
+    DeleteSegmentCommand,
+    type InsertSegmentCommand,
+    type RenameSpeakerCommand,
     RestoreSegmentCommand,
-    TranscriptonNameChangeCommand,
-    UpdateSegementCommand,
+    TranscriptionNameChangeCommand,
+    UpdateSegmentCommand,
 } from "~/types/commands";
-import type { SegementWithId } from "~/types/transcriptionResponse";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import type { SegmentWithId } from "~/types/transcriptionResponse";
 
-export const useTranscriptionService = (currentTranscriptionId: string) => {
-    const store = useTranscriptionsStore();
-    const error = ref<string>();
-    const isInited = ref(false);
+export const useTranscriptionCommandHandler = (
+    transcription: Ref<StoredTranscription | undefined>,
+) => {
     const logger = useLogger();
-    const { registerHandler, unregisterHandler } = useCommandBus();
-
-    store.initializeDB();
-    store
-        .setCurrentTranscription(currentTranscriptionId)
-        .then(() => {
-            isInited.value = true;
-        })
-        .catch((err) => {
-            error.value = err;
-        });
-
-    async function handleDeleteSegment(command: DeleteSegementCommand) {
-        const currentTranscription = store.currentTranscription;
-
-        if (!currentTranscription) {
-            logger.warn("Current transcription not found");
-            return;
-        }
-
-        // Find the segment before deleting it to store its data for undo
-        const segmentToDelete = currentTranscription.segments.find(
-            (s) => s.id === command.segmentId,
-        );
-
-        if (!segmentToDelete) {
-            logger.warn("Segment to delete not found");
-            return;
-        }
-
-        // Create an undo command with the complete segment data including its ID
-        // We'll use RestoreSegmentCommand to restore the deleted segment with its original ID
-        const undoCommand = new RestoreSegmentCommand(segmentToDelete);
-
-        // Set the undo command on the delete command
-        command.setUndoCommand(undoCommand);
-
-        // Now delete the segment
-        currentTranscription.segments = currentTranscription.segments.filter(
-            (s) => s.id !== command.segmentId,
-        );
-
-        store.updateCurrentTranscription({
-            segments: currentTranscription.segments,
-        });
-    }
-
-    async function handleInsertSegment(command: InsertSegementCommand) {
-        const currentTranscription = store.currentTranscription;
-
-        if (!currentTranscription) {
-            logger.warn("Current transcription not found");
-            return;
-        }
-
-        const targetIndex = currentTranscription.segments.findIndex(
-            (s) => s.id === command.targetSegmentId,
-        );
-        if (targetIndex === -1) {
-            logger.warn("Target segment not found");
-            return;
-        }
-
-        const targetSegment = currentTranscription.segments[targetIndex];
-
-        if (!targetSegment) {
-            logger.warn("Target segment is undefined");
-            return;
-        }
-
-        const start =
-            command.direction === "before"
-                ? targetSegment.start - 2
-                : targetSegment.end;
-
-        const newSegement = {
-            id: uuid(),
-            start: start,
-            end: start + 2,
-            text: "",
-            ...command.newSegement,
-        } as SegementWithId;
-
-        command.setUndoCommand(new DeleteSegementCommand(newSegement.id));
-
-        currentTranscription.segments.splice(targetIndex, 0, newSegement);
-
-        const newTranscriptions = currentTranscription.segments.toSorted(
-            (a, b) => a.start - b.start,
-        );
-        store.updateCurrentTranscription({ segments: newTranscriptions });
-    }
-
-    async function handleAddSegment(command: AddSegmentCommand): Promise<void> {
-        const currentTranscription = store.currentTranscription;
-
-        if (!currentTranscription) {
+    const { onCommand } = useCommandBus();
+    const { updateTranscription } = getTranscriptionService();
+
+    onCommand<DeleteSegmentCommand>(
+        Cmds.DeleteSegmentCommand,
+        async (command) => {
+            if (!transcription.value) {
+                logger.warn("Current transcription not found");
+                return;
+            }
+
+            // Find the segment before deleting it to store its data for undo
+            const segmentToDelete = transcription.value.segments.find(
+                (s) => s.id === command.segmentId,
+            );
+
+            if (!segmentToDelete) {
+                logger.warn("Segment to delete not found");
+                return;
+            }
+
+            // Create an undo command with the complete segment data including its ID
+            // We'll use RestoreSegmentCommand to restore the deleted segment with its original ID
+            const undoCommand = new RestoreSegmentCommand(segmentToDelete);
+
+            // Set the undo command on the delete command
+            command.setUndoCommand(undoCommand);
+
+            // Now delete the segment
+            transcription.value.segments = transcription.value.segments.filter(
+                (s) => s.id !== command.segmentId,
+            );
+
+            await updateTranscription(transcription.value.id, {
+                segments: transcription.value.segments.map((x) => ({ ...x })),
+            });
+        },
+    );
+
+    onCommand<InsertSegmentCommand>(
+        Cmds.InsertSegmentCommand,
+        async (command) => {
+            if (!transcription.value) {
+                logger.warn("Current transcription not found");
+                return;
+            }
+
+            const targetIndex = transcription.value.segments.findIndex(
+                (s) => s.id === command.targetSegmentId,
+            );
+            if (targetIndex === -1) {
+                logger.warn("Target segment not found");
+                return;
+            }
+
+            const targetSegment = transcription.value.segments[targetIndex];
+
+            if (!targetSegment) {
+                logger.warn("Target segment is undefined");
+                return;
+            }
+
+            const start =
+                command.direction === "before"
+                    ? targetSegment.start - 2
+                    : targetSegment.end;
+
+            const newSegment = {
+                id: uuid(),
+                start: start,
+                end: start + 2,
+                text: "",
+                ...command.newSegment,
+            } as SegmentWithId;
+
+            command.setUndoCommand(new DeleteSegmentCommand(newSegment.id));
+
+            transcription.value.segments.splice(targetIndex, 0, newSegment);
+
+            const newTranscriptions = transcription.value.segments
+                .toSorted((a, b) => a.start - b.start)
+                .map((x) => ({ ...x }));
+
+            await updateTranscription(transcription.value.id, {
+                segments: newTranscriptions,
+            });
+        },
+    );
+
+    onCommand<AddSegmentCommand>(Cmds.AddSegmentCommand, async (command) => {
+        if (!transcription.value) {
             logger.warn("Current transcription not found");
             return;
         }
 
-        const newSegement = {
+        const newSegment = {
             id: uuid(),
-            ...command.newSegement,
-        } as SegementWithId;
-
-        command.setUndoCommand(new DeleteSegementCommand(newSegement.id));
-
-        currentTranscription.segments.push(newSegement);
-
-        const newTranscriptions = currentTranscription.segments.toSorted(
-            (a, b) => a.start - b.start,
-        );
-        store.updateCurrentTranscription({ segments: newTranscriptions });
-    }
-
-    async function handleUpdateSegment(command: UpdateSegementCommand) {
-        const currentTranscription = store.currentTranscription;
-
-        if (!currentTranscription) {
-            logger.warn("Current transcription not found");
-            return;
-        }
-
-        const segment = currentTranscription.segments.find(
-            (s) => s.id === command.segmentId,
-        );
-
-        if (!segment) {
-            logger.warn("Target segment not found");
-            return;
-        }
-
-        const updatedSegment = { ...segment, ...command.updates };
-        command.setUndoCommand(
-            new UpdateSegementCommand(command.segmentId, segment),
-        );
-
-        const newSegments = currentTranscription.segments
-            .map((s) => (s.id === command.segmentId ? updatedSegment : s))
-            .sort((a, b) => a.start - b.start);
-
-        store.updateCurrentTranscription({ segments: newSegments });
-    }
+            ...command.newSegment,
+        } as SegmentWithId;
 
-    async function handleNameChanged(command: TranscriptonNameChangeCommand) {
-        const currentTranscription = store.currentTranscription;
+        command.setUndoCommand(new DeleteSegmentCommand(newSegment.id));
 
-        if (!currentTranscription) {
-            logger.warn("Current transcription not found");
-            return;
-        }
-
-        const oldName = currentTranscription.name;
-        command.setUndoCommand(new TranscriptonNameChangeCommand(oldName));
-
-        store.updateCurrentTranscription({ name: command.newName });
-    }
+        transcription.value.segments.push(newSegment);
 
-    async function handleRenameSpeaker(command: RenameSpeakerCommand) {
-        const currentTranscription = store.currentTranscription;
-
-        if (!currentTranscription) {
-            logger.warn("Current transcription not found");
-            return;
-        }
+        const newTranscriptions = transcription.value.segments
+            .toSorted((a, b) => a.start - b.start)
+            .map((x) => ({ ...x }));
 
-        const newSegments = currentTranscription.segments.map((s) =>
-            s.speaker === command.oldName
-                ? { ...s, speaker: command.newName }
-                : s,
-        );
-
-        store.updateCurrentTranscription({ segments: newSegments });
-    }
-
-    async function handleRestoreSegment(command: RestoreSegmentCommand) {
-        const currentTranscription = store.currentTranscription;
-
-        if (!currentTranscription) {
-            logger.warn("Current transcription not found");
-            return;
-        }
-
-        // Add the restored segment back to the segments array
-        currentTranscription.segments.push(command.segmentData);
-
-        // Sort segments by start time to maintain proper order
-        const newSegments = currentTranscription.segments.toSorted(
-            (a, b) => a.start - b.start,
-        );
-
-        store.updateCurrentTranscription({ segments: newSegments });
-    }
-
-    function registerService() {
-        registerHandler(Cmds.DeleteSegementCommand, handleDeleteSegment);
-        registerHandler(Cmds.InsertSegementCommand, handleInsertSegment);
-        registerHandler(Cmds.UpdateSegementCommand, handleUpdateSegment);
-        registerHandler(Cmds.TranscriptonNameChangeCommand, handleNameChanged);
-        registerHandler(Cmds.RenameSpeakerCommand, handleRenameSpeaker);
-        registerHandler(Cmds.AddSegmentCommand, handleAddSegment);
-        registerHandler(Cmds.RestoreSegmentCommand, handleRestoreSegment);
-    }
-
-    function unRegisterServer() {
-        unregisterHandler(Cmds.DeleteSegementCommand, handleDeleteSegment);
-        unregisterHandler(Cmds.InsertSegementCommand, handleInsertSegment);
-        unregisterHandler(Cmds.UpdateSegementCommand, handleUpdateSegment);
-        unregisterHandler(
-            Cmds.TranscriptonNameChangeCommand,
-            handleNameChanged,
-        );
-        unregisterHandler(Cmds.RenameSpeakerCommand, handleRenameSpeaker);
-        unregisterHandler(Cmds.AddSegmentCommand, handleAddSegment);
-        unregisterHandler(Cmds.RestoreSegmentCommand, handleRestoreSegment);
-    }
-
-    return { registerService, unRegisterServer, error, isInited };
+        await updateTranscription(transcription.value.id, {
+            segments: newTranscriptions,
+        });
+    });
+
+    onCommand<UpdateSegmentCommand>(
+        Cmds.UpdateSegmentCommand,
+        async (command) => {
+            if (!transcription.value) {
+                logger.warn("Current transcription not found");
+                return;
+            }
+
+            const segmentIndex = transcription.value.segments.findIndex(
+                (s) => s.id === command.segmentId,
+            );
+
+            const segment = transcription.value.segments[segmentIndex];
+
+            if (!segment) {
+                logger.warn("Target segment not found");
+                return;
+            }
+
+            const updatedSegment = { ...segment, ...command.updates };
+            command.setUndoCommand(
+                new UpdateSegmentCommand(command.segmentId, segment),
+            );
+
+            const newSegments = transcription.value.segments
+                .map((s) =>
+                    s.id === command.segmentId
+                        ? { ...updatedSegment }
+                        : { ...s },
+                )
+                .sort((a, b) => a.start - b.start);
+
+            transcription.value.segments[segmentIndex] = updatedSegment;
+
+            await updateTranscription(transcription.value.id, {
+                segments: newSegments,
+            });
+        },
+    );
+
+    onCommand<TranscriptionNameChangeCommand>(
+        Cmds.TranscriptionNameChangeCommand,
+        async (command) => {
+            if (!transcription.value) {
+                logger.warn("Current transcription not found");
+                return;
+            }
+
+            const oldName = transcription.value.name;
+            command.setUndoCommand(new TranscriptionNameChangeCommand(oldName));
+
+            updateTranscription(transcription.value.id, {
+                name: command.newName,
+            });
+
+            transcription.value.name = command.newName;
+        },
+    );
+
+    onCommand<RenameSpeakerCommand>(
+        Cmds.RenameSpeakerCommand,
+        async (command) => {
+            if (!transcription.value) {
+                logger.warn("Current transcription not found");
+                return;
+            }
+
+            const newSegments = transcription.value.segments.map((s) =>
+                s.speaker === command.oldName
+                    ? { ...s, speaker: command.newName }
+                    : { ...s },
+            );
+
+            updateTranscription(transcription.value.id, {
+                segments: newSegments,
+            });
+        },
+    );
+
+    onCommand<RestoreSegmentCommand>(
+        Cmds.RestoreSegmentCommand,
+        async (command) => {
+            if (!transcription.value) {
+                logger.warn("Current transcription not found");
+                return;
+            }
+
+            // Add the restored segment back to the segments array
+            transcription.value.segments.push(command.segmentData);
+
+            // Sort segments by start time to maintain proper order
+            const newSegments = transcription.value.segments
+                .toSorted((a, b) => a.start - b.start)
+                .map((x) => ({ ...x }));
+
+            updateTranscription(transcription.value.id, {
+                segments: newSegments,
+            });
+        },
+    );
 };
diff --git a/app/composables/useAudioExtract.ts b/app/composables/useAudioExtract.ts
index 94b7a3a..f2b3eb8 100644
--- a/app/composables/useAudioExtract.ts
+++ b/app/composables/useAudioExtract.ts
@@ -14,6 +14,10 @@ function toBlob(data: Uint8Array | string, mimeType: string): Blob {
 export const useAudioExtract = () => {
     const ffmpeg = new FFmpeg();
 
+    onUnmounted(() => {
+        ffmpeg.terminate();
+    });
+
     async function extractAudioFromVideo(
         videoFile: File,
     ): Promise<{ audioBlob: Blob; audioFileName: string }> {
@@ -49,7 +53,6 @@ export const useAudioExtract = () => {
         } finally {
             await ffmpeg.deleteFile(videoFileName);
             await ffmpeg.deleteFile(audioFileName);
-            await ffmpeg.terminate();
         }
     }
     return {
diff --git a/app/composables/useAudioUpload.ts b/app/composables/useAudioUpload.ts
index 50a2ed1..91f9533 100644
--- a/app/composables/useAudioUpload.ts
+++ b/app/composables/useAudioUpload.ts
@@ -53,7 +53,7 @@ export function useAudioUpload() {
                     color: "error",
                     icon: "i-lucide-triangle-alert",
                 });
-                return;
+                throw response;
             }
 
             executeCommand(new UploadFileCommand(originalFile, response));
diff --git a/app/composables/useDateFormatter.ts b/app/composables/useDateFormatter.ts
new file mode 100644
index 0000000..9ec8d53
--- /dev/null
+++ b/app/composables/useDateFormatter.ts
@@ -0,0 +1,17 @@
+export function useDateFormatter() {
+    function formatDate(timestamp: Date | number): string {
+        const date =
+            timestamp instanceof Date ? timestamp : new Date(timestamp);
+        return date.toLocaleString("de-CH", {
+            day: "numeric",
+            month: "short",
+            hour: "2-digit",
+            minute: "2-digit",
+            hour12: false,
+        });
+    }
+
+    return {
+        formatDate,
+    };
+}
diff --git a/app/composables/useSpectrogramGenerator.ts b/app/composables/useSpectrogramGenerator.ts
index c2a7ffa..4aa7de3 100644
--- a/app/composables/useSpectrogramGenerator.ts
+++ b/app/composables/useSpectrogramGenerator.ts
@@ -69,7 +69,7 @@ export function useSpectrogramGenerator() {
                 err instanceof Error
                     ? err.message
                     : "Unknown error generating spectrogram";
-            logger.error("Spectrogram generation error:", err);
+            logger.error(err, "Spectrogram generation error:");
             error.value = errorMessage;
 
             // Return an empty result with the error
@@ -116,7 +116,7 @@ export function useSpectrogramGenerator() {
                 err instanceof Error
                     ? err.message
                     : "Unknown error generating spectrogram";
-            logger.error("Spectrogram generation error:", err);
+            logger.error(err, "Spectrogram generation error:");
             error.value = errorMessage;
 
             // Return an empty result with the error
diff --git a/app/composables/useTaskListener.ts b/app/composables/useTaskListener.ts
new file mode 100644
index 0000000..ec32568
--- /dev/null
+++ b/app/composables/useTaskListener.ts
@@ -0,0 +1,146 @@
+import { apiFetch, isApiError } from "@dcc-bs/communication.bs.js";
+import { match } from "ts-pattern";
+import { v4 as uuidv4 } from "uuid";
+import type { MediaProgress } from "~/types/mediaProgress";
+import {
+    type TaskStatus,
+    TaskStatusEnum,
+    TaskStatusSchema,
+} from "~/types/task";
+import {
+    type TranscriptionResponse,
+    TranscriptionResponseSchema,
+} from "~/types/transcriptionResponse";
+
+export function useTaskListener() {
+    const { deleteTask } = useTasks();
+    const { addTranscription } = getTranscriptionService();
+    const { showError } = useUserFeedback();
+    const { t } = useI18n();
+    const logger = useLogger();
+
+    function createProgress(status: TaskStatus): MediaProgress {
+        return {
+            icon: "i-lucide-cpu",
+            message: status.status ?? "",
+            progress: calculateProgress(status),
+        };
+    }
+
+    function calculateProgress(taskStatus: TaskStatus) {
+        return match(taskStatus.status)
+            .returnType<number>()
+            .with(TaskStatusEnum.IN_PROGRESS, () => taskStatus.progress ?? 0)
+            .with(TaskStatusEnum.COMPLETED, () => 1)
+            .with(TaskStatusEnum.FAILED, () => 1)
+            .with(TaskStatusEnum.CANCELLED, () => 0)
+            .otherwise(() => 0);
+    }
+
+    async function pollTaskStatus(
+        taskId: string,
+        onProgressUpdate: (progress: MediaProgress) => void,
+        onComplete: (transcription: TranscriptionResponse) => void,
+    ) {
+        let status = {
+            task_id: taskId,
+            progress: 0,
+            status: TaskStatusEnum.IN_PROGRESS,
+        } as TaskStatus;
+        try {
+            while (status.status === TaskStatusEnum.IN_PROGRESS) {
+                status = await fetchTaskStatus(taskId);
+                onProgressUpdate(createProgress(status));
+
+                if (status.status !== TaskStatusEnum.IN_PROGRESS) {
+                    break;
+                }
+
+                await new Promise((resolve) => setTimeout(resolve, 5000));
+            }
+
+            if (status.status === TaskStatusEnum.COMPLETED) {
+                const result = await fetchTaskResult(status.task_id);
+                onComplete(result);
+            }
+        } catch (e) {
+            logger.error(
+                e,
+                `Poll Task status with id ${status.task_id} failed`,
+            );
+
+            status.status = TaskStatusEnum.FAILED;
+            onProgressUpdate(createProgress(status));
+        }
+    }
+
+    async function fetchTaskStatus(taskId: string): Promise<TaskStatus> {
+        const newStatus = await apiFetch(`/api/transcribe/${taskId}/status`, {
+            schema: TaskStatusSchema,
+        });
+
+        if (isApiError(newStatus)) {
+            logger.error(newStatus, `Fetch of status with id ${taskId} failed`);
+            showError(newStatus);
+            return {
+                status: TaskStatusEnum.FAILED,
+                task_id: taskId,
+                progress: 0,
+            } as TaskStatus;
+        }
+
+        return newStatus;
+    }
+
+    async function fetchTaskResult(
+        taskId: string,
+    ): Promise<TranscriptionResponse> {
+        try {
+            const response = await apiFetch(`/api/transcribe/${taskId}`, {
+                schema: TranscriptionResponseSchema,
+            });
+
+            if (isApiError(response)) {
+                showError(response);
+                throw response;
+            }
+
+            return response;
+        } catch (e) {
+            logger.error(e, `Failed to fetch task result with id ${taskId}`);
+            throw e;
+        }
+    }
+
+    /*
+        This will store the transcription and removes the task from the storage.
+    */
+    async function applyTaskResult(
+        taskId: string,
+        result: TranscriptionResponse,
+        mediaFile: Blob,
+        mediaName: string,
+    ): Promise<void> {
+        const transcription = await addTranscription({
+            segments: result.segments.map((x) => ({
+                ...x,
+                text: x.text?.trim() ?? "",
+                speaker:
+                    x.speaker?.trim().toUpperCase() ??
+                    t("transcription.noSpeaker"),
+                id: uuidv4(),
+            })),
+            mediaFile: mediaFile,
+            mediaFileName: mediaName,
+            name: mediaName ?? t("transcription.untitled"),
+        });
+
+        await deleteTask(taskId);
+        await navigateTo(`/transcription/${transcription.id}`);
+    }
+
+    return {
+        pollTaskStatus,
+        applyTaskResult,
+    };
+}
diff --git a/app/composables/useTaskStatus.ts b/app/composables/useTaskStatus.ts
new file mode 100644
index 0000000..fd19c60
--- /dev/null
+++ b/app/composables/useTaskStatus.ts
@@ -0,0 +1,67 @@
+import { type TaskStatus, TaskStatusEnum } from "~/types/task";
+
+type BadgeColor =
+    | "error"
+    | "info"
+    | "success"
+    | "neutral"
+    | "primary"
+    | "secondary"
+    | "warning";
+
+export function useTaskStatus() {
+    const { t } = useI18n();
+
+    function getStatusDisplay(status: TaskStatusEnum): string {
+        switch (status) {
+            case TaskStatusEnum.IN_PROGRESS:
+                return t("processing.status.inProgress");
+            case TaskStatusEnum.COMPLETED:
+                return t("processing.status.completed");
+            case TaskStatusEnum.FAILED:
+                return t("processing.status.failed");
+            case TaskStatusEnum.CANCELLED:
+                return t("processing.status.cancelled");
+            default:
+                return status;
+        }
+    }
+
+    function getStatusColor(status: TaskStatusEnum): BadgeColor {
+        switch (status) {
+            case TaskStatusEnum.IN_PROGRESS:
+                return "info";
+            case TaskStatusEnum.COMPLETED:
+                return "success";
+            case TaskStatusEnum.FAILED:
+                return "error";
+            case TaskStatusEnum.CANCELLED:
+                return "neutral";
+            default:
+                return "neutral";
+        }
+    }
+
+    function computeTaskProgress(taskStatus: TaskStatus): number {
+        switch (taskStatus.status) {
+            case TaskStatusEnum.IN_PROGRESS:
+                return typeof taskStatus.progress === "number"
+                    ? taskStatus.progress
+                    : 0;
+            case TaskStatusEnum.COMPLETED:
+                return 1;
+            case TaskStatusEnum.FAILED:
+                return 1;
+            case TaskStatusEnum.CANCELLED:
+                return 0;
+            default:
+                return 0;
+        }
+    }
+
+    return {
+        getStatusDisplay,
+        getStatusColor,
+        computeTaskProgress,
+    };
+}
diff --git a/app/composables/useTasks.ts b/app/composables/useTasks.ts
new file mode 100644
index 0000000..2da38a3
--- /dev/null
+++ b/app/composables/useTasks.ts
@@ -0,0 +1,83 @@
+import { db } from "@/stores/db";
+import {
+    type StoredTask,
+    StoredTaskSchema,
+    type TaskStatus,
+    TaskStatusEnum,
+} from "~/types/task";
+
+const RETENTION_PERIOD_MS = 24 * 60 * 60 * 1000;
+
+export function useTasks() {
+    function getTasks(): Promise<StoredTask[]> {
+        return db.tasks.toArray();
+    }
+
+    function getTask(id: string): Promise<StoredTask | undefined> {
+        return db.tasks.where("id").equals(id).first();
+    }
+
+    async function addTask(
+        status: TaskStatus,
+        mediaFile?: File | Blob,
+        mediaFileName?: string,
+    ): Promise<StoredTask> {
+        const newTask = StoredTaskSchema.parse({
+            id: status.task_id,
+            status,
+            createdAt: new Date(),
+        } as StoredTask);
+
+        if (mediaFile) {
+            newTask.mediaFile = mediaFile;
+            newTask.mediaFileName = mediaFileName ?? "media-file";
+        }
+
+        await db.tasks.add(newTask);
+
+        return newTask;
+    }
+
+    async function updateTaskStatus(
+        id: string,
+        status: TaskStatus,
+    ): Promise<void> {
+        await db.tasks.update(id, { status: status });
+    }
+
+    async function deleteTask(id: string) {
+        await db.tasks.delete(id);
+    }
+
+    async function cleanupOldTask(): Promise<number> {
+        const now = new Date();
+
+        return db.tasks
+            .filter(
+                (t) =>
+                    !!t.createdAt &&
+                    now.getTime() - t.createdAt.getTime() > RETENTION_PERIOD_MS,
+            )
+            .delete();
+    }
+
+    async function cleanupFailedAndCanceledTasks() {
+        await db.tasks
+            .filter(
+                (t) =>
+                    t.status.status === TaskStatusEnum.FAILED ||
+                    t.status.status === TaskStatusEnum.COMPLETED,
+            )
+            .delete();
+    }
+
+    return {
+        getTasks,
+        getTask,
+        addTask,
+        deleteTask,
+        updateTaskStatus,
+        cleanupOldTask,
+        cleanupFailedAndCanceledTasks,
+    };
+}
diff --git a/app/composables/useTranscriptionSummary.ts b/app/composables/useTranscriptionSummary.ts
new file mode 100644
index 0000000..dd30486
--- /dev/null
+++ b/app/composables/useTranscriptionSummary.ts
@@ -0,0 +1,126 @@
+import { apiFetch, isApiError } from "@dcc-bs/communication.bs.js";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import { SummaryResponseSchema } from "~/types/summarizeResponse";
+import type { SummarizeRequest, SummaryType } from "~~/shared/types/summary";
+
+export function useTranscriptionSummary() {
+    const { updateTranscription } = getTranscriptionService();
+    const logger = useLogger();
+
+    const isSummaryGenerating = ref(false);
+
+    /**
+     * Get the complete text from all segments
+     */
+    function getTranscriptionText(transcription: StoredTranscription): string {
+        // Helper method to extract text from segments
+        return transcription.segments.map((segment) => segment.text).join(" ");
+    }
+
+    /**
+     * Helper function to validate and sanitize transcript text
+     */
+    function validateAndSanitizeTranscriptText(text: string): string {
+        if (!text || typeof text !== "string") {
+            throw new Error(
+                "Transcript text is required and must be a string.",
+            );
+        }
+
+        // Trim whitespace
+        const trimmedText = text.trim();
+
+        if (trimmedText.length === 0) {
+            throw new Error("Transcript text cannot be empty.");
+        }
+
+        // Check minimum length (at least 10 characters for meaningful content)
+        const MIN_LENGTH = 10;
+        if (trimmedText.length < MIN_LENGTH) {
+            throw new Error(
+                `Transcript text must be at least ${MIN_LENGTH} characters long.`,
+            );
+        }
+
+        // Check maximum length to prevent oversized requests
+        const MAX_LENGTH = 32000 * 4;
+        if (trimmedText.length > MAX_LENGTH) {
+            throw new Error(
+                `Transcript text is too large. Maximum allowed length is ${MAX_LENGTH} characters.`,
+            );
+        }
+
+        return trimmedText;
+    }
+
+    /**
+     * Generate and store a summary for the current transcription
+     */
+    async function generateSummary(
+        transcription: StoredTranscription,
+        type: SummaryType,
+        language?: string,
+    ): Promise<string | null> {
+        // Prevent concurrent calls
+        if (isSummaryGenerating.value) {
+            throw new Error(
+                "Summary generation is already in progress for this transcription.",
+            );
+        }
+
+        const isRegeneration = !!transcription.summary;
+
+        try {
+            isSummaryGenerating.value = true;
+
+            // If regenerating, clear the existing summary immediately
+            if (isRegeneration) {
+                transcription.summary = undefined;
+            }
+
+            const transcriptText = getTranscriptionText(transcription);
+
+            // Validate and sanitize transcript text
+            const sanitizedText =
+                validateAndSanitizeTranscriptText(transcriptText);
+
+            const requestBody: SummarizeRequest = {
+                transcript: sanitizedText,
+                summary_type: type,
+            };
+
+            // Add language if specified
+            if (language) {
+                requestBody.language = language;
+            }
+
+            const summaryResponse = await apiFetch("/api/summarize/submit", {
+                schema: SummaryResponseSchema,
+                method: "POST",
+                body: requestBody,
+            });
+
+            if (isApiError(summaryResponse)) {
+                throw summaryResponse;
+            }
+
+            const summary = summaryResponse.summary;
+
+            // Store the summary in the current transcription with proper reactivity
+            transcription.summary = summary;
+
+            await updateTranscription(transcription.id, {
+                summary: transcription.summary,
+            });
+
+            return summary;
+        } catch (error) {
+            logger.error(error, "Failed to generate summary:");
+            throw error;
+        } finally {
+            isSummaryGenerating.value = false;
+        }
+    }
+
+    return { isSummaryGenerating, generateSummary };
+}
diff --git a/app/composables/useTranscriptions.ts b/app/composables/useTranscriptions.ts
new file mode 100644
index 0000000..0e73b40
--- /dev/null
+++ b/app/composables/useTranscriptions.ts
@@ -0,0 +1,30 @@
+import { liveQuery, type Subscription } from "dexie";
+import { db } from "~/stores/db";
+import type { StoredTranscription } from "~/types/storedTranscription";
+
+export function useTranscriptions() {
+    const transcriptions = ref<StoredTranscription[]>();
+    const logger = useLogger();
+
+    let subscription: Subscription | undefined;
+
+    onMounted(() => {
+        const transcriptionObservable = liveQuery(() =>
+            db.transcriptions.toArray(),
+        );
+
+        subscription = transcriptionObservable.subscribe({
+            next: (next) => (transcriptions.value = next),
+            error: (error) =>
+                logger.error(error, "Error fetching transcriptions:"),
+        });
+    });
+
+    onUnmounted(() => {
+        subscription?.unsubscribe();
+    });
+
+    return {
+        transcriptions,
+    };
+}
diff --git a/app/layouts/default.vue b/app/layouts/default.vue
index 2597868..3f23dff 100644
--- a/app/layouts/default.vue
+++ b/app/layouts/default.vue
@@ -1,13 +1,66 @@
 <script setup lang="ts">
+import { ShowOnboardingCommand } from "~/types/commands";
+
+const { t } = useI18n();
+
+const { executeCommand } = useCommandBus();
+
+const { currentRoute } = useRouter();
+
+const isInEditor = computed(() => {
+    return currentRoute.value.path.match(/transcription\/.+/) !== null;
+});
 </script>
 
 <template>
+    <div class="min-h-screen flex flex-col justify-stretch">
+        <NavigationMenu>
+            <template #center>
+                <!-- Center: Action buttons -->
+                <div class="flex items-center justify-center shrink-0 h-full">
+                    <UTooltip :text="t('navigation.new')">
+                        <ULink to="/">
+                            <UButton variant="ghost" icon="i-lucide-plus">
+                                <span class="hidden md:inline">
+                                    {{ t("navigation.new") }}
+                                </span>
+                            </UButton>
+                        </ULink>
+                    </UTooltip>
+
+                    <UTooltip :text="t('navigation.transcriptions')">
+                        <ULink to="/transcription">
+                            <UButton variant="ghost" icon="i-lucide-list">
+                                <span class="hidden md:inline">
+                                    {{ t("navigation.transcriptions") }}
+                                </span>
+                            </UButton>
+                        </ULink>
+                    </UTooltip>
+                </div>
+            </template>
+            <template #rightPreItems>
+                <UTooltip v-if="isInEditor" :text="t('onboarding.help')">
+                    <UButton
+                        id="help-button"
+                        icon="i-lucide-circle-help"
+                        variant="ghost"
+                        color="neutral"
+                        @click="executeCommand(new ShowOnboardingCommand())"
+                    />
+                </UTooltip>
+            </template>
+        </NavigationMenu>
 
-    <NavigationMenu />
-    <div class="h-[600px] md:h-[calc(100vh-100px)] flex flex-col overflow-auto">
-        <div class="grow">
-            <slot />
+        <div class="grow flex flex-col justify-stretch">
+            <div class="flex flex-col grow">
+                <slot />
+            </div>
+            <DataBsFooter>
+                <template #right>
+                    <FeedbackControl inline />
+                </template>
+            </DataBsFooter>
         </div>
-        <DataBsFooter />
     </div>
-</template>
\ No newline at end of file
+</template>
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 106c70c..6c4d02a 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -1,115 +1,67 @@
 <script lang="ts" setup>
-import type { UploadMediaView } from "#components";
-import { Cmds, type UploadFileCommand } from "~/types/commands";
+import type { UploadFileCommand } from "~/types/commands";
+import { Cmds } from "~/types/commands";
+import type {
+    MediaConfigureData,
+    MediaSelectionData,
+} from "~/types/mediaStepInOut";
 
-const tasksStore = useTasksStore();
 const { t } = useI18n();
 const { onCommand } = useCommandBus();
-const { uploadFile } = useAudioUpload();
+const { addTask } = useTasks();
 
-const uploadMediaView = shallowRef<InstanceType<typeof UploadMediaView>>();
-
-interface FeaturePanel {
-    id: "upload" | "record";
-    titleKey: string;
-    descriptionKey: string;
-    icon: string;
-    label: string;
-    accentClasses: {
-        wrapper: string;
-        icon: string;
-        text: string;
-    };
-}
-
-// Lightweight config keeps the template compact while ensuring consistent styling.
-const featurePanels: FeaturePanel[] = [
-    {
-        id: "upload",
-        titleKey: "pages.index.uploadMedia",
-        descriptionKey: "pages.index.uploadDescription",
-        icon: "i-lucide-file-up",
-        label: "Upload",
-        accentClasses: {
-            wrapper: "bg-blue-100 dark:bg-blue-900/30",
-            icon: "text-blue-600 dark:text-blue-400",
-            text: "text-blue-700 dark:text-blue-300",
-        },
-    },
-    {
-        id: "record",
-        titleKey: "pages.index.recordAudio",
-        descriptionKey: "pages.index.recordDescription",
-        icon: "i-lucide-mic",
-        label: "Record",
-        accentClasses: {
-            wrapper: "bg-green-100 dark:bg-green-900/30",
-            icon: "text-green-600 dark:text-green-400",
-            text: "text-green-700 dark:text-green-300",
-        },
-    },
-];
+const step = ref(1);
+const mediaSelectionData = ref<MediaSelectionData>();
+const mediaPreviewData = ref<MediaConfigureData>();
 
 onCommand<UploadFileCommand>(Cmds.UploadFileCommand, async (command) => {
     const file = command.file;
     const status = command.status;
 
-    const storedTask = await tasksStore.addTask(status, file, file.name);
+    const storedTask = await addTask(status, file, file.name);
     navigateTo(`task/${storedTask.id}`);
 });
 
-async function handleRecordingComplete(audioBlob: Blob): Promise<void> {
-    const file = new File([audioBlob], "recording.webm", {
-        type: "audio/webm",
-    });
-
-    if (!uploadMediaView.value) {
-        throw new Error("UploadMediaView reference is not set.");
-    }
+function onMediaSelected(data: MediaSelectionData) {
+    mediaSelectionData.value = data;
+    step.value = 2;
+}
 
-    uploadFile(file, file);
+function onMediaConfigure(payload: MediaConfigureData) {
+    mediaPreviewData.value = payload;
+    step.value = 3;
 }
 </script>
 
 <template>
-    <UContainer class="py-12 space-y-12">
-        <section class="text-center space-y-4 max-w-3xl mx-auto">
-            <h1 class="text-4xl font-bold text-gray-900 dark:text-white">
-                {{ t("pages.index.title") || "Transcribo" }}
-            </h1>
-            <p class="text-lg text-gray-600 dark:text-gray-300">
-                {{ t("pages.index.subtitle") }}
-            </p>
-        </section>
+    <div class="mx-auto">
+        <p class="text-lg text-gray-600 dark:text-gray-300 m-4">
+            {{ t("pages.index.subtitle") }}
+        </p>
+
+        <div class="flex items-center justify-center">
+            <UButton variant="link" :class="{ 'font-bold': step === 1 }" @click="step = 1">
+                1. Upload Media
+            </UButton>
+            <template v-if="step > 1">
+                <UIcon name="i-lucide-chevron-right" />
+                <UButton variant="link" :class="{ 'font-bold': step === 2 }" @click="step = 2">
+                    2. Settings
+                </UButton>
+            </template>
+            <template v-if="step > 2">
+                <UIcon name="i-lucide-chevron-right" />
+                <UButton variant="link" v-if="step > 2" :class="{ 'font-bold': step === 3 }">
+                    3. Process Media
+                </UButton>
+            </template>
+        </div>
 
-        <div class="grid gap-8 md:grid-cols-2">
-            <section v-for="panel in featurePanels" :key="panel.id" :id="panel.id"
-                class="flex h-full flex-col gap-6 rounded-3xl border border-gray-200/60 dark:border-gray-800/70 bg-white/80 dark:bg-gray-900/60 p-6 shadow-sm backdrop-blur">
-                <div class="flex items-start gap-4">
-                    <div class="p-3 rounded-2xl" :class="panel.accentClasses.wrapper">
-                        <UIcon :name="panel.icon" class="w-6 h-6" :class="panel.accentClasses.icon" />
-                    </div>
-                    <div class="space-y-1">
-                        <span class="text-xs font-semibold uppercase tracking-wide" :class="panel.accentClasses.text">
-                            {{ panel.label }}
-                        </span>
-                        <h2 class="text-2xl font-semibold text-gray-900 dark:text-white">
-                            {{ t(panel.titleKey) }}
-                        </h2>
-                        <p class="text-sm text-gray-500 dark:text-gray-400">
-                            {{ t(panel.descriptionKey) }}
-                        </p>
-                    </div>
-                </div>
-                <!-- Center the recording button vertically while keeping upload content anchored -->
-                <div :class="panel.id === 'record'
-                    ? 'flex-1 flex items-center justify-center'
-                    : 'mt-auto'
-                    ">
-                    <UploadMediaView v-if="panel.id === 'upload'" ref="uploadMediaView" />
-                    <AudioRecordingView v-else @on-recording-complete="handleRecordingComplete" />
-                </div>
-            </section>
+        <div class="p-2">
+            <MediaSelectionView v-if="step === 1" @onMediaSelected="onMediaSelected" />
+            <MediaPreviewView v-if="step === 2 && mediaSelectionData" v-model:input="mediaSelectionData"
+                @on-next="onMediaConfigure" />
+            <MediaProcessingView v-if="step === 3 && mediaPreviewData" v-model:input="mediaPreviewData" />
         </div>
-    </UContainer>
+    </div>
 </template>
diff --git a/app/pages/task/[taskId].vue b/app/pages/task/[taskId].vue
index c992ae2..2d957be 100644
--- a/app/pages/task/[taskId].vue
+++ b/app/pages/task/[taskId].vue
@@ -1,101 +1,82 @@
 <script lang="ts" setup>
-import { v4 as uuidv4 } from "uuid";
-import type { TranscriptionFinishedCommand } from "~/types/commands";
-import { Cmds } from "~/types/commands";
+import { motion } from "motion-v";
+import { useTasks } from "~/composables/useTasks";
+import type { MediaProgress } from "~/types/mediaProgress";
 
-const { registerHandler, unregisterHandler } = useCommandBus();
-const taskStore = useTasksStore();
-const transcriptionsStore = useTranscriptionsStore();
+const { getTask } = useTasks();
 const { t } = useI18n();
 const logger = useLogger();
+const { pollTaskStatus, applyTaskResult } = useTaskListener();
 
 const route = useRoute();
+
 const taskId = route.params.taskId as string;
-const audioFile = ref<Blob>();
-const audioName = ref<string>();
 
-const isLoaded = ref(false);
+const mediaFile = ref<Blob>();
+const mediaFileName = ref<string>();
+
 const errorMessage = ref<string>();
 
-onMounted(() => {
-    registerHandler(
-        Cmds.TranscriptionFinishedCommand,
-        handleTranscriptionFinished,
-    );
+const progression = ref<[MediaProgress]>([
+    {
+        icon: "i-lucide-cpu",
+        message: "..",
+        progress: 0
+    }]
+);
 
-    taskStore
-        .getTask(taskId)
-        .then((task) => {
-            if (task?.mediaFile) {
-                audioFile.value = task.mediaFile;
-                audioName.value = task.mediaFileName;
-                isLoaded.value = true;
-            } else {
-                errorMessage.value = t("task.errors.noMediaFile");
-                logger.error("No media file found for task", taskId);
-            }
-        })
-        .catch((e) => {
-            errorMessage.value = t("task.errors.failedToLoad");
-            logger.error("Failed to get task", taskId, e);
-        });
-});
+onMounted(async () => {
+    try {
+        const task = await getTask(taskId);
 
-const cleanupTimeout = ref<NodeJS.Timeout>();
+        if (!task) {
+            logger.error(taskId, "Task not found");
+            errorMessage.value = t("task.errors.TaskNotFound");
+            return;
+        }
 
-onUnmounted(() => {
-    if (cleanupTimeout.value) {
-        clearTimeout(cleanupTimeout.value);
-    }
-    unregisterHandler(
-        Cmds.TranscriptionFinishedCommand,
-        handleTranscriptionFinished,
-    );
-});
+        if (!task.mediaFile) {
+            errorMessage.value = t("task.errors.noMediaFile");
+            logger.error(taskId, "No media file found for task");
+            return;
+        }
 
-async function handleTranscriptionFinished(
-    command: TranscriptionFinishedCommand,
-): Promise<void> {
-    if (command.status.status === "completed" && command.result) {
-        try {
-            const transcription = await transcriptionsStore.addTranscription({
-                segments: command.result.segments.map((x) => ({
-                    ...x,
-                    text: x.text?.trim() ?? "",
-                    speaker:
-                        x.speaker?.trim().toUpperCase() ??
-                        t("transcription.noSpeaker"),
-                    id: uuidv4(),
-                })),
-                mediaFile: audioFile.value,
-                mediaFileName: audioName.value,
-                name: audioName.value ?? t("transcription.untitled"),
-            });
+        mediaFile.value = task.mediaFile;
+        mediaFileName.value = task.mediaFileName;
 
-            await navigateTo(`/transcription/${transcription.id}`);
-            taskStore.deleteTask(taskId);
-        } catch (error) {
-            logger.error("Failed to create transcription:", error);
-            errorMessage.value = t("task.errors.failedToCreateTranscription");
-        }
-    } else if (
-        command.status.status === "failed" ||
-        command.status.status === "cancelled"
-    ) {
-        errorMessage.value = t("task.errors.transcriptionFailed");
-        // Clean up the failed task after a delay to allow user to see the error
-        cleanupTimeout.value = setTimeout(() => {
-            taskStore.deleteTask(taskId);
-        }, 5000);
-    } else {
-        errorMessage.value = t("task.errors.noResult");
+        pollTaskStatus(
+            taskId,
+            ({ message, progress }) => {
+                progression.value[0].message = message;
+                progression.value[0].progress = progress;
+            }, async (transcription) => {
+                try {
+                    if (!task.mediaFile || !task.mediaFileName) {
+                        throw new Error("Task has no media file");
+                    }
+
+                    await applyTaskResult(taskId, transcription, task.mediaFile, task.mediaFileName);
+                } catch (e) {
+                    logger.error(e, "Failed to finihs the task");
+                    errorMessage.value = t("task.errors.failedToCreateTranscription");
+                }
+            });
+    } catch (e) {
+        errorMessage.value = t("task.errors.failedToLoad");
+        logger.error({ taskId, error: e }, "Failed to get task");
     }
-}
+});
 </script>
 
 <template>
-    <UContainer>
-        <TaskStatusView v-if="taskId && isLoaded" :task-id="taskId" />
-        <UAlert v-if="errorMessage" color="error" :title="errorMessage" icon="i-lucide-circle-alert" type="error" />
-    </UContainer>
+    <div class="flex items-center justify-center">
+        <MediaProgressView v-if="mediaFile && mediaFileName" :media="mediaFile" :media-name="mediaFileName"
+            :progress-steps="progression" />
+
+        <!-- Error Message Display -->
+        <motion.div v-if="errorMessage" :animate="{ opacity: 1, y: 0 }" :initial="{ opacity: 0, y: 20 }"
+            :transition="{ type: 'spring', stiffness: 200, damping: 20 }" class="mt-8 max-w-md w-full">
+            <UAlert icon="i-lucide-alert-circle" color="error" title="error" :description="errorMessage"></UAlert>
+        </motion.div>
+    </div>
 </template>
diff --git a/app/pages/transcription/[transcriptionId].vue b/app/pages/transcription/[transcriptionId].vue
index 7b2cfcf..7048169 100644
--- a/app/pages/transcription/[transcriptionId].vue
+++ b/app/pages/transcription/[transcriptionId].vue
@@ -1,253 +1,164 @@
 <script lang="ts" setup>
-import { UInput } from "#components";
-import { TranscriptonNameChangeCommand } from "~/types/commands";
+import { createReusableTemplate } from "@vueuse/core";
+import { motion } from "motion-v";
+import { type ChangeEditorModeCommand, Cmds } from "~/types/commands";
+import type { EditorMode } from "~/types/editor";
+import type { StoredTranscription } from "~/types/storedTranscription";
 
 const route = useRoute();
-const transcriptionStore = useTranscriptionsStore();
-const { executeCommand } = useCommandBus();
 const { t } = useI18n();
-const mediaUrl = computed(() => {
-    if (transcriptionStore.currentTranscription?.mediaFile) {
-        return URL.createObjectURL(
-            transcriptionStore.currentTranscription?.mediaFile,
-        );
-    }
-
-    return undefined;
-});
-
-const mediaName = computed(() => {
-    if (transcriptionStore.currentTranscription?.mediaFileName) {
-        return transcriptionStore.currentTranscription?.mediaFileName;
-    }
-
-    return undefined;
-});
+const { getTranscription } = getTranscriptionService();
+const [DefineMainContent, UseMainContent] = createReusableTemplate();
+const { onCommand } = useCommandBus();
 
 const transcriptionId = route.params.transcriptionId as string;
-const { registerService, unRegisterServer, error, isInited } =
-    useTranscriptionService(transcriptionId);
-const isHelpViewOpen = ref(false);
+const onboardingRef = ref<InstanceType<typeof Onboarding> | null>(null);
 
-// Summary state
-const summaryError = ref<string | null>(null);
-const isSummaryExpanded = ref(false);
+const currentTranscription = ref<StoredTranscription>();
+const isTranscriptionLoading = ref(true);
 
-// View mode state - default to viewer mode as requested
-const isViewMode = ref(false);
+useTranscriptionCommandHandler(currentTranscription);
 
-onMounted(() => {
-    registerService();
-});
+const editorMode = ref<EditorMode>("view");
 
-onUnmounted(() => {
-    unRegisterServer();
+onMounted(async () => {
+    currentTranscription.value = await getTranscription(transcriptionId);
+    isTranscriptionLoading.value = false;
 });
 
-async function handleNameChange(name: string | number) {
-    if (typeof name === "string") {
-        await executeCommand(new TranscriptonNameChangeCommand(name));
-    }
-}
-
-async function handleGenerateSummary(): Promise<void> {
-    if (transcriptionStore.isSummaryGenerating) return;
-
-    summaryError.value = null;
-    // Collapse summary section when regenerating (it will expand again after new summary is generated)
-    isSummaryExpanded.value = false;
-
-    try {
-        await transcriptionStore.generateSummary();
-        // Expand the summary section after successful generation/regeneration
-        isSummaryExpanded.value = true;
-    } catch (error) {
-        summaryError.value =
-            error instanceof Error
-                ? error.message
-                : "Failed to generate summary";
-    }
-}
+onCommand<ChangeEditorModeCommand>(
+    Cmds.ChangeEditorModeCommand,
+    async (command) => {
+        editorMode.value = command.newMode;
+    },
+);
+
+// Animation variants
+const pageTransition = {
+    type: "spring" as const,
+    stiffness: 200,
+    damping: 25,
+};
 </script>
 
 <template>
-    <div>
-        <div
-            v-if="transcriptionStore.currentTranscription && isInited"
-            class="p-2"
-        >
-            <!-- Single line with Download Media, File Name edit, Export, and Help -->
-            <div class="flex items-center gap-2 mb-4">
-                <!-- Download Media Button -->
-                <a
-                    v-if="mediaUrl && mediaName"
-                    :href="mediaUrl"
-                    :download="mediaName"
-                >
-                    <UButton
-                        icon="i-lucide-download"
-                        variant="ghost"
-                        :label="t('media.downloadMedia')"
-                        color="info"
-                        size="sm"
-                    />
-                </a>
+    <Onboarding ref="onboardingRef" />
 
-                <!-- File Name Input -->
-                <UInput
-                    class="flex-1 min-w-0"
-                    :model-value="transcriptionStore.currentTranscription.name"
-                    @update:model-value="handleNameChange"
-                    placeholder="Transcription name"
-                />
+    <HContainer class="grow min-h-125">
+        <template #top>
+            <div class="flex md:hidden items-center justify-center mb-2">
+                <EditorModeSelector v-model="editorMode" id-prefix="mobile-" />
+            </div>
+            <div
+                class="w-full flex flex-wrap justify-between items-center gap-2"
+            >
+                <!-- Transcription Info Portal Target (left-aligned) -->
+                <div class="flex-1 min-w-0">
+                    <TranscriptionInfoView
+                        v-if="currentTranscription"
+                        :transcription="currentTranscription"
+                    />
+                </div>
 
-                <!-- Mode Toggle Button -->
+                <!-- Center: Mode selector -->
                 <div
-                    class="flex items-center bg-gray-100 dark:bg-gray-800 rounded-lg p-1"
+                    class="hidden md:flex items-center justify-center shrink-0 gap-2"
                 >
-                    <UButton
-                        icon="i-lucide-eye"
-                        :variant="isViewMode ? 'solid' : 'ghost'"
-                        :label="t('mode.viewer')"
-                        :color="isViewMode ? 'primary' : 'neutral'"
-                        size="sm"
-                        @click="isViewMode = true"
-                        class="min-w-20 font-medium"
-                        :class="{ 'shadow-sm': isViewMode }"
-                    />
-                    <UButton
-                        icon="i-lucide-square-pen"
-                        :variant="!isViewMode ? 'solid' : 'ghost'"
-                        :label="t('mode.editor')"
-                        :color="!isViewMode ? 'primary' : 'neutral'"
-                        size="sm"
-                        @click="isViewMode = false"
-                        class="min-w-20 font-medium ml-1"
-                        :class="{ 'shadow-sm': !isViewMode }"
+                    <EditorModeSelector
+                        v-model="editorMode"
+                        id-prefix="desktop-"
                     />
                 </div>
 
-                <!-- Generate Summary Button -->
-                <UButton
-                    v-if="!transcriptionStore.currentTranscription.summary"
-                    icon="i-lucide-lightbulb"
-                    variant="ghost"
-                    :label="
-                        transcriptionStore.isSummaryGenerating
-                            ? t('summary.generating')
-                            : t('summary.generate')
-                    "
-                    color="primary"
-                    size="sm"
-                    :loading="transcriptionStore.isSummaryGenerating"
-                    :disabled="transcriptionStore.isSummaryGenerating"
-                    @click="handleGenerateSummary"
-                />
-
-                <!-- Summary buttons when summary exists -->
-                <template v-else>
-                    <!-- Regenerate Summary Button -->
-                    <UButton
-                        icon="i-lucide-loader-circle"
-                        variant="ghost"
-                        :label="
-                            transcriptionStore.isSummaryGenerating
-                                ? t('summary.regenerating')
-                                : t('summary.regenerate')
-                        "
-                        color="primary"
-                        size="sm"
-                        :loading="transcriptionStore.isSummaryGenerating"
-                        :disabled="transcriptionStore.isSummaryGenerating"
-                        @click="handleGenerateSummary"
+                <!-- Export Portal Target (right-aligned) -->
+                <div class="flex-1 min-w-0 flex justify-end">
+                    <ExportToolbar
+                        v-if="currentTranscription"
+                        :transcription="currentTranscription"
                     />
-                </template>
-
-                <!-- Export Toolbar -->
-                <ExportToolbar />
+                </div>
             </div>
-
-            <!-- Summary Section -->
-            <div
-                v-if="transcriptionStore.currentTranscription.summary"
-                class="mb-4"
+        </template>
+        <template #default>
+            <template v-if="isTranscriptionLoading">
+                <LoadingView :loadingText="t('transcription.loading')" />
+            </template>
+            <template v-else-if="currentTranscription">
+                <UseMainContent />
+            </template>
+            <template v-else>
+                <motion.div
+                    :animate="{ opacity: 1, scale: 1 }"
+                    :initial="{ opacity: 0, scale: 0.95 }"
+                    :transition="{ duration: 0.4 }"
+                    class="flex flex-col items-center justify-center min-h-[60vh] p-8"
+                >
+                    <div
+                        class="w-20 h-20 rounded-2xl bg-gray-100 dark:bg-gray-800 flex items-center justify-center mb-4"
+                    >
+                        <UIcon
+                            name="i-lucide-file-x"
+                            class="w-10 h-10 text-gray-400 dark:text-gray-500"
+                        />
+                    </div>
+                    <p
+                        class="text-gray-500 dark:text-gray-400 text-lg font-medium"
+                    >
+                        {{
+                            t("transcription.notFound") ||
+                            "Transcription not found"
+                        }}
+                    </p>
+                </motion.div>
+            </template>
+        </template>
+    </HContainer>
+
+    <DefineMainContent id="does-this-work">
+        <template v-if="currentTranscription">
+            <motion.div
+                id="main-content"
+                :animate="{ opacity: 1, y: 0 }"
+                :initial="{ opacity: 0, y: 20 }"
+                :transition="pageTransition"
+                class="flex flex-col p-2 sm:p-4 grow"
             >
-                <UCollapsible
-                    v-model:open="isSummaryExpanded"
-                    class="border border-gray-200 rounded-lg"
+                <!-- Content Area with Mode Transition -->
+                <motion.div
+                    class="grow flex flex-col"
+                    :key="editorMode"
+                    :animate="{ opacity: 1, y: 0 }"
+                    :initial="{ opacity: 0, y: 10 }"
+                    :transition="{ duration: 0.25, ease: 'easeOut' }"
                 >
-                    <UButton
-                        :label="t('summary.title')"
-                        :trailing-icon="
-                            isSummaryExpanded
-                                ? 'i-lucide-chevron-up'
-                                : 'i-lucide-chevron-down'
-                        "
-                        variant="ghost"
-                        color="neutral"
-                        class="w-full justify-between p-4 text-lg font-semibold"
-                        :ui="{
-                            trailingIcon: 'transition-transform duration-200',
-                        }"
-                        block
-                    />
-
-                    <template #content>
-                        <div class="p-4 border-t border-gray-200">
-                            <div
-                                class="prose prose-sm max-w-none max-h-96 overflow-y-auto"
-                            >
-                                <MDC
-                                    :value="
-                                        transcriptionStore.currentTranscription
-                                            .summary
-                                    "
-                                />
-                            </div>
-                        </div>
+                    <!-- Viewer Mode -->
+                    <template v-if="editorMode === 'view'">
+                        <TranscriptionViewer
+                            :transcription="currentTranscription"
+                        />
                     </template>
-                </UCollapsible>
-            </div>
 
-            <!-- Summary Error Alert -->
-            <div v-if="summaryError" class="mb-4">
-                <UAlert
-                    color="error"
-                    :title="t('summary.error')"
-                    :description="summaryError"
-                    icon="i-lucide-triangle-alert"
-                    @close="summaryError = null"
-                    closable
-                />
-            </div>
+                    <template v-else-if="editorMode === 'summary'">
+                        <TranscriptionSummaryView
+                            :transcription="currentTranscription"
+                        />
+                    </template>
 
-            <!-- Viewer Mode -->
-            <div v-if="isViewMode" class="h-[calc(100vh-12rem)]">
-                <TranscriptionViewer />
-            </div>
+                    <!-- Editor Mode -->
+                    <template v-else-if="editorMode === 'edit'">
+                        <TranscriptionEditView
+                            :transcription="currentTranscription"
+                        />
+                    </template>
 
-            <!-- Editor Mode -->
-            <SplitView v-else>
-                <template #a>
-                    <MediaEditor />
-                </template>
-                <template #b>
-                    <div class="overflow-y-auto max-h-[calc(100vh-12rem)]">
-                        <TranscriptionList class="p-2" />
-                    </div>
-                </template>
-            </SplitView>
-        </div>
-        <div v-else-if="error" class="p-4 text-center">
-            <UAlert
-                color="error"
-                title="Error"
-                :description="t('transcription.notFound')"
-                icon="i-lucide-triangle-alert"
-            />
-        </div>
-        <div v-else class="p-4 text-center">
-            <p>{{ t("transcription.loading") }}</p>
-        </div>
-    </div>
+                    <!-- Statistics Mode -->
+                    <template v-else-if="editorMode === 'statistics'">
+                        <SpeakerStatisticsView
+                            :transcription="currentTranscription"
+                        />
+                    </template>
+                </motion.div>
+            </motion.div>
+        </template>
+    </DefineMainContent>
 </template>
diff --git a/app/pages/transcription/disclaimer.vue b/app/pages/transcription/disclaimer.vue
new file mode 100644
index 0000000..95a5724
--- /dev/null
+++ b/app/pages/transcription/disclaimer.vue
@@ -0,0 +1,17 @@
+<script lang="ts" setup>
+import disclaimerTextRaw from "~/assets/disclaimer.html?raw";
+
+const disclaimerText = disclaimerTextRaw as string;
+
+definePageMeta({
+    layout: false,
+});
+</script>
+
+<template>
+    <Disclaimer
+        appName="Transcribo"
+        :postfixHTML="disclaimerText"
+        confirmationText="Ich habe die Hinweise gelesen und verstanden und bestätige, dass ich Transcribo ausschliesslich unter Einhaltung der genannten Richtlinien verwende."
+    />
+</template>
diff --git a/app/pages/transcription/index.vue b/app/pages/transcription/index.vue
index 0d0e206..82f8301 100644
--- a/app/pages/transcription/index.vue
+++ b/app/pages/transcription/index.vue
@@ -1,10 +1,9 @@
 <script lang="ts" setup>
 import { isApiError } from "@dcc-bs/communication.bs.js";
-import { UButton, ULink } from "#components";
-import type { StoredTask } from "~/stores/tasksStore";
-import { TRANSCRIPTION_RETENTION_PERIOD_MS } from "~/stores/transcriptionsStore";
-import type { StoredTranscription } from "~/types/storedTranscription";
-import type { TaskStatus } from "~/types/task";
+import { TRANSCRIPTION_RETENTION_PERIOD_MS } from "#imports";
+import ProcessingTasksTable from "~/components/transcription/ProcessingTasksTable.vue";
+import TranscriptionTable from "~/components/transcription/TranscriptionTable.vue";
+import type { StoredTask } from "~/types/task";
 import { TaskStatusEnum, TaskStatusSchema } from "~/types/task";
 import { TranscriptionResponseSchema } from "~/types/transcriptionResponse";
 
@@ -12,181 +11,35 @@ const retentionDays = computed(() => {
     return Math.ceil(TRANSCRIPTION_RETENTION_PERIOD_MS / (1000 * 60 * 60 * 24));
 });
 
-const transcriptionStore = useTranscriptionsStore();
-const taskStore = useTasksStore();
-const { openDialog } = useDialog();
+const { transcriptions } = useTranscriptions();
+const { addTranscription, deleteTranscription } = getTranscriptionService();
+
+const {
+    getTask,
+    getTasks,
+    updateTaskStatus,
+    deleteTask,
+    cleanupFailedAndCanceledTasks,
+} = useTasks();
 const { t } = useI18n();
 const { apiFetch } = useApi();
 
-// Define columns for the table
-const columns = [
-    {
-        accessorKey: "name",
-        header: t("transcription.table.name"),
-        enableSorting: true,
-        enableResizing: true,
-        size: 200,
-        maxSize: 300,
-    },
-    {
-        accessorKey: "createdAt",
-        header: t("transcription.table.createdAt"),
-        enableResizing: true,
-        enableSorting: true,
-        cell: (props: { row: { original: StoredTranscription } }) => {
-            return new Date(props.row.original.createdAt).toLocaleString(
-                "de-CH",
-                {
-                    day: "numeric",
-                    month: "short",
-                    hour: "2-digit",
-                    minute: "2-digit",
-                    hour12: false,
-                },
-            );
-        },
-    },
-    {
-        accessorKey: "updatedAt",
-        header: t("transcription.table.updatedAt"),
-        enableSorting: true,
-        enableResizing: true,
-        cell: (opts: unknown) => {
-            const row = (
-                opts as { row: { getValue: (key: string) => unknown } }
-            ).row;
-            return new Date(row.getValue("updatedAt") as number).toLocaleString(
-                "de-CH",
-                {
-                    day: "numeric",
-                    month: "short",
-                    hour: "2-digit",
-                    minute: "2-digit",
-                    hour12: false,
-                },
-            );
-        },
-    },
-    {
-        accessorKey: "actions",
-        header: "",
-    },
-];
-
-// Pending (in-progress) tasks state
 const processingTasks = ref<StoredTask[]>([]);
 const isProcessingLoading = ref(false);
 const processingError = ref<string>();
+let refreshInterval: number | unknown | undefined;
 
-// Columns for pending tasks table
-const processingColumns = [
-    {
-        accessorKey: "mediaFileName",
-        header: t("processing.table.fileName"),
-        enableSorting: true,
-        enableResizing: true,
-        size: 200,
-        maxSize: 300,
-    },
-    {
-        accessorKey: "createdAt",
-        header: t("processing.table.createdAt"),
-        enableResizing: true,
-        enableSorting: true,
-        cell: (opts: unknown) => {
-            const row = (
-                opts as { row: { getValue: (key: string) => unknown } }
-            ).row;
-            const createdAt = row.getValue("createdAt") as number;
-            return new Date(createdAt).toLocaleString("de-CH", {
-                day: "numeric",
-                month: "short",
-                hour: "2-digit",
-                minute: "2-digit",
-                hour12: false,
-            });
-        },
-    },
-    {
-        accessorKey: "status",
-        header: t("processing.table.status"),
-        enableSorting: true,
-        enableResizing: true,
-    },
-];
-
-// Filter to only show in-progress tasks in UI
 const inProgressTasks = computed(() =>
     processingTasks.value.filter(
-        (t) => t.status.status === TaskStatusEnum.IN_PROGRESS,
+        (task) => task.status.status === TaskStatusEnum.IN_PROGRESS,
     ),
 );
 
-function getStatusDisplay(status: TaskStatusEnum): string {
-    switch (status) {
-        case TaskStatusEnum.IN_PROGRESS:
-            return t("processing.status.inProgress");
-        case TaskStatusEnum.COMPLETED:
-            return t("processing.status.completed");
-        case TaskStatusEnum.FAILED:
-            return t("processing.status.failed");
-        case TaskStatusEnum.CANCELLED:
-            return t("processing.status.cancelled");
-        default:
-            return status;
-    }
-}
-
-function getStatusColor(
-    status: TaskStatusEnum,
-):
-    | "error"
-    | "info"
-    | "success"
-    | "neutral"
-    | "primary"
-    | "secondary"
-    | "warning" {
-    switch (status) {
-        case TaskStatusEnum.IN_PROGRESS:
-            return "info";
-        case TaskStatusEnum.COMPLETED:
-            return "success";
-        case TaskStatusEnum.FAILED:
-            return "error";
-        case TaskStatusEnum.CANCELLED:
-            return "neutral";
-        default:
-            return "neutral";
-    }
-}
-
-// Compute progress for a given task status using the same logic as TaskStatusView
-function computeTaskProgress(taskStatus: TaskStatus): number {
-    switch (taskStatus.status) {
-        case TaskStatusEnum.IN_PROGRESS:
-            return typeof taskStatus.progress === "number"
-                ? taskStatus.progress
-                : 0;
-        case TaskStatusEnum.COMPLETED:
-            return 1;
-        case TaskStatusEnum.FAILED:
-            return 1;
-        case TaskStatusEnum.CANCELLED:
-            return 0;
-        default:
-            return 0;
-    }
-}
-
-// Check task status and convert to transcription if completed
 async function checkTaskStatus(task: StoredTask): Promise<void> {
     try {
         const statusResponse = await apiFetch(
             `/api/transcribe/${task.id}/status`,
-            {
-                schema: TaskStatusSchema
-            }
+            { schema: TaskStatusSchema },
         );
 
         if (isApiError(statusResponse)) {
@@ -194,48 +47,51 @@ async function checkTaskStatus(task: StoredTask): Promise<void> {
         }
 
         if (statusResponse.status === TaskStatusEnum.COMPLETED) {
-            const transcriptionResponse = await apiFetch(`/api/transcribe/${task.id}`, {
-                schema: TranscriptionResponseSchema
-            });
+            const transcriptionResponse = await apiFetch(
+                `/api/transcribe/${task.id}`,
+                { schema: TranscriptionResponseSchema },
+            );
 
-            const fullTask = await taskStore.getTask(task.id);
+            const fullTask = await getTask(task.id);
             if (!fullTask?.mediaFile) {
                 throw new Error(t("task.errors.noMediaFile"));
             }
 
             if (isApiError(transcriptionResponse)) {
-                processingError.value = t(`errors.${transcriptionResponse.errorId}`);
+                processingError.value = t(
+                    `errors.${transcriptionResponse.errorId}`,
+                );
                 return;
             }
 
-            await transcriptionStore.addTranscription(
-                {
-                    segments: transcriptionResponse.segments.map((segment) => ({
-                        ...segment,
-                        id: crypto.randomUUID(),
-                    })),
-                    name: task.mediaFileName || t("transcription.untitled"),
-                },
-                fullTask.mediaFile,
-                task.mediaFileName,
-            );
+            await addTranscription({
+                segments: transcriptionResponse.segments.map((segment) => ({
+                    ...segment,
+                    id: crypto.randomUUID(),
+                })),
+                name: task.mediaFileName || t("transcription.untitled"),
+                mediaFile: fullTask.mediaFile,
+                mediaFileName: task.mediaFileName,
+            });
 
-            await taskStore.deleteTask(task.id);
+            await deleteTask(task.id);
             await loadProcessingTasks();
         } else if (
             statusResponse.status === TaskStatusEnum.FAILED ||
             statusResponse.status === TaskStatusEnum.CANCELLED
         ) {
-            // Update local status; cleanup will remove these after polling finishes
-            await taskStore.updateTask(task.id, { status: statusResponse });
-            processingTasks.value = processingTasks.value.map((t) =>
-                t.id === task.id ? { ...t, status: statusResponse } : t,
+            await updateTaskStatus(task.id, statusResponse);
+            processingTasks.value = processingTasks.value.map((taskItem) =>
+                taskItem.id === task.id
+                    ? { ...taskItem, status: statusResponse }
+                    : taskItem,
             );
         } else if (statusResponse.status === TaskStatusEnum.IN_PROGRESS) {
-            // Update local task status to reflect progress in UI
-            await taskStore.updateTask(task.id, { status: statusResponse });
-            processingTasks.value = processingTasks.value.map((t) =>
-                t.id === task.id ? { ...t, status: statusResponse } : t,
+            updateTaskStatus(task.id, statusResponse);
+            processingTasks.value = processingTasks.value.map((taskItem) =>
+                taskItem.id === task.id
+                    ? { ...taskItem, status: statusResponse }
+                    : taskItem,
             );
         }
     } catch (err: unknown) {
@@ -245,8 +101,7 @@ async function checkTaskStatus(task: StoredTask): Promise<void> {
             "statusCode" in err &&
             (err as { statusCode?: number }).statusCode === 404
         ) {
-            // Task no longer exists on backend; remove locally
-            await taskStore.deleteTask(task.id);
+            await deleteTask(task.id);
             await loadProcessingTasks();
             return;
         }
@@ -261,12 +116,11 @@ async function checkTaskStatus(task: StoredTask): Promise<void> {
     }
 }
 
-// Load tasks and poll in-progress ones
 async function loadProcessingTasks(): Promise<void> {
     try {
         isProcessingLoading.value = true;
         processingError.value = undefined;
-        const allTasks = await taskStore.loadAllTasks();
+        const allTasks = await getTasks();
         processingTasks.value = allTasks;
 
         const tasksToCheck = allTasks.filter(
@@ -277,8 +131,7 @@ async function loadProcessingTasks(): Promise<void> {
             tasksToCheck.map((task) => checkTaskStatus(task)),
         );
 
-        // After polling, cleanup failed and cancelled tasks from local storage
-        await cleanupFailedAndCancelledTasks();
+        await cleanupFailedAndCanceledTasks();
     } catch (err: unknown) {
         processingError.value =
             err instanceof Error
@@ -293,43 +146,10 @@ async function refreshStatuses(): Promise<void> {
     await loadProcessingTasks();
 }
 
-// Remove tasks with status FAILED or CANCELLED from local storage and UI
-async function cleanupFailedAndCancelledTasks(): Promise<void> {
-    try {
-        const idsToDelete = processingTasks.value
-            .filter(
-                (t) =>
-                    t.status.status === TaskStatusEnum.FAILED ||
-                    t.status.status === TaskStatusEnum.CANCELLED,
-            )
-            .map((t) => t.id);
-
-        if (idsToDelete.length === 0) return;
-
-        await Promise.allSettled(
-            idsToDelete.map((id) => taskStore.deleteTask(id)),
-        );
-
-        // Reflect deletions in local UI state
-        processingTasks.value = processingTasks.value.filter(
-            (t) => !idsToDelete.includes(t.id),
-        );
-    } catch (err: unknown) {
-        const errorMsg =
-            err instanceof Error
-                ? err.message
-                : t("processing.errors.loadFailed");
-        if (!processingError.value) {
-            processingError.value = errorMsg;
-        }
-    }
-}
-
-onMounted(() => {
-    transcriptionStore.loadAllTranscriptions();
+onMounted(async () => {
     loadProcessingTasks();
 
-    const refreshInterval = setInterval(() => {
+    refreshInterval = setInterval(() => {
         const hasInProgressTasks = processingTasks.value.some(
             (task) => task.status.status === TaskStatusEnum.IN_PROGRESS,
         );
@@ -337,106 +157,38 @@ onMounted(() => {
             refreshStatuses();
         }
     }, 10000);
-
-    onUnmounted(() => {
-        clearInterval(refreshInterval);
-    });
 });
 
-function handleDeletedTranscription(transcriptionId: string): void {
-    openDialog({
-        title: t("transcription.delete.title"),
-        message: t("transcription.delete.confirmation"),
-        onSubmit: () => transcriptionStore.deleteTranscription(transcriptionId),
-    });
-}
+onUnmounted(() => {
+    if (refreshInterval) {
+        clearInterval(refreshInterval as number);
+    }
+});
 </script>
 
 <template>
-    <UContainer>
-        <UAlert icon="i-lucide-info" color="info" variant="soft" :title="t('retention.title')" :description="t('retention.description', { retentionDays: retentionDays })
-            " />
-        <!-- Pending tasks section (shown only when there are in-progress tasks) -->
-        <div v-if="inProgressTasks.length > 0" class="space-y-6 mb-8">
-            <div class="flex justify-between items-center">
-                <div>
-                    <h2 class="text-xl font-bold">
-                        {{ t("processing.title") }}
-                    </h2>
-                    <p class="text-gray-600 mt-1">
-                        {{ t("processing.description") }}
-                    </p>
-                </div>
-                <UButton icon="i-lucide-loader-circle" @click="refreshStatuses" :loading="isProcessingLoading">
-                    {{ t("processing.refresh") }}
-                </UButton>
-            </div>
-
-            <UAlert v-if="processingError" icon="i-lucide-triangle-alert" color="error" variant="soft"
-                :title="t('processing.errors.title')" :description="processingError"
-                @dismiss="processingError = undefined" />
-
-            <UTable :columns="processingColumns" :data="inProgressTasks" sticky :loading="isProcessingLoading"
-                :empty-state="{
-                    icon: 'i-lucide-clock',
-                    label: t('processing.noTasksFound'),
-                    description: t('processing.noTasksDescription'),
-                }" :sorting-options="{ enableSorting: true }">
-                <template #mediaFileName-cell="{ row }">
-                    <div class="font-medium text-wrap">
-                        {{
-                            row.original.mediaFileName ||
-                            t("processing.unknownFile")
-                        }}
-                    </div>
-                </template>
-
-                <template #status-cell="{ row }">
-                    <div class="flex items-center gap-2">
-                        <UBadge :color="getStatusColor(row.original.status.status)" variant="subtle">
-                            {{ getStatusDisplay(row.original.status.status) }}
-                        </UBadge>
-                        <template v-if="
-                            row.original.status.status ===
-                            TaskStatusEnum.IN_PROGRESS
-                        ">
-                            <UIcon name="i-lucide-cog" class="animate-spin text-blue-600" />
-                            <span class="text-sm text-blue-600">({{
-                                Math.round(
-                                    computeTaskProgress(
-                                        row.original.status,
-                                    ) * 100,
-                                )
-                            }}%)</span>
-                        </template>
-                    </div>
-                </template>
-            </UTable>
-        </div>
-
-        <UTable :columns="columns" :data="transcriptionStore.transcriptions" sticky :empty-state="{
-            icon: 'i-lucide-file-text',
-            label: t('transcription.noTranscriptionsFound'),
-            description: t('ui.emptyState.description'),
-        }" :sorting-options="{ enableSorting: true }">
-            <!-- Custom cell renderer for the name column -->
-            <template #name-cell="{ row }">
-                <div class="font-bold text-wrap">{{ row.original.name }}</div>
-            </template>
-
-            <!-- Custom cell renderer for the actions column -->
-            <template #actions-cell="{ row }">
-                <div class="flex gap-2 justify-end">
-                    <ULink :to="`transcription/${row.original.id}`">
-                        <UButton icon="i-lucide-pencil" color="primary">
-                            {{ t("transcription.actions.edit") }}
-                        </UButton>
-                    </ULink>
-                    <UButton icon="i-lucide-trash-2" color="error" @click="handleDeletedTranscription(row.original.id)">
-                        {{ t("transcription.actions.delete") }}
-                    </UButton>
-                </div>
-            </template>
-        </UTable>
-    </UContainer>
+    <div class="m-auto">
+        <UAlert
+            icon="i-lucide-info"
+            color="info"
+            variant="soft"
+            :title="t('retention.title')"
+            :description="
+                t('retention.description', { retentionDays: retentionDays })
+            "
+        />
+
+        <ProcessingTasksTable
+            :tasks="inProgressTasks"
+            :loading="isProcessingLoading"
+            :error="processingError"
+            @refresh="refreshStatuses"
+            @dismiss-error="processingError = undefined"
+        />
+
+        <TranscriptionTable
+            :transcriptions="transcriptions"
+            @delete="deleteTranscription"
+        />
+    </div>
 </template>
diff --git a/app/plugins/cleanupTranscriptions.client.ts b/app/plugins/cleanupTranscriptions.client.ts
new file mode 100644
index 0000000..824f54d
--- /dev/null
+++ b/app/plugins/cleanupTranscriptions.client.ts
@@ -0,0 +1,11 @@
+export default defineNuxtPlugin(async (_) => {
+    const logger = useLogger();
+    const { cleanupOldTranscriptions } = getTranscriptionService();
+
+    try {
+        const n = await cleanupOldTranscriptions();
+        logger.info(`Cleaned up ${n} old transcriptions`);
+    } catch (e) {
+        logger.error(e, "Failed to clean up old transcriptions");
+    }
+});
diff --git a/app/services/indexDbService.ts b/app/services/indexDbService.ts
deleted file mode 100644
index 7acf04d..0000000
--- a/app/services/indexDbService.ts
+++ /dev/null
@@ -1,262 +0,0 @@
-// Database configuration
-const DB_NAME = "transcribo-db";
-const TRANSCIPTION_STORE_NAME = "transcriptions";
-const TASK_STORE_NAME = "tasks";
-const DB_VERSION = 3; // Updated version for createdAt index addition
-
-/**
- * Database migration history:
- * - v1: Initial schema with transcriptions and tasks stores
- * - v2: Added 'summary' field to transcription records for AI-generated meeting summaries
- * - v3: Added 'createdAt' index for efficient retention cleanup
- */
-
-/**
- * Get the current database version
- */
-export async function getCurrentDBVersion(): Promise<number> {
-    return new Promise<number>((resolve, reject) => {
-        const request = indexedDB.open(DB_NAME);
-
-        request.onsuccess = (event) => {
-            const db = (event.target as IDBOpenDBRequest).result;
-            const version = db.version;
-            db.close();
-            resolve(version);
-        };
-
-        request.onerror = () => {
-            reject(new Error("Failed to get database version"));
-        };
-    });
-}
-
-/**
- * Initialize the IndexedDB database with migration support
- */
-export async function initDB() {
-    return new Promise<IDBDatabase>((resolve, reject) => {
-        let migrationInfo: { oldVersion: number; newVersion: number } | null =
-            null;
-
-        // Open database connection
-        const request = indexedDB.open(DB_NAME, DB_VERSION);
-
-        // Handle database upgrade (first time or version change)
-        request.onupgradeneeded = (event) => {
-            const requestInstance = event.target as IDBOpenDBRequest;
-            const db = requestInstance.result;
-            const upgradeTransaction = requestInstance.transaction;
-            const oldVersion = event.oldVersion;
-            const newVersion = event.newVersion || DB_VERSION;
-
-            console.log(
-                `Upgrading database schema from version ${oldVersion} to ${newVersion}`,
-            );
-
-            // Store migration info for data migrations after connection
-            migrationInfo = { oldVersion, newVersion };
-
-            // Only perform schema changes here (creating stores and indexes)
-            createTaskStore(db, upgradeTransaction);
-            createTranscriptionStore(db, upgradeTransaction);
-        };
-
-        // Handle successful connection
-        request.onsuccess = async (event) => {
-            const db = (event.target as IDBOpenDBRequest).result;
-
-            try {
-                // Run data migrations after schema is established
-                if (migrationInfo && migrationInfo.oldVersion > 0) {
-                    await runDataMigrations(
-                        db,
-                        migrationInfo.oldVersion,
-                        migrationInfo.newVersion,
-                    );
-                }
-                resolve(db);
-            } catch (error) {
-                db.close();
-                reject(error);
-            }
-        };
-
-        // Handle errors
-        request.onerror = (event) => {
-            const error = `Database error: ${(event.target as IDBOpenDBRequest).error?.message}`;
-            reject(new Error(error));
-        };
-    });
-}
-
-function createTranscriptionStore(
-    db: IDBDatabase,
-    transaction: IDBTransaction | null,
-) {
-    let store: IDBObjectStore | undefined;
-
-    if (!db.objectStoreNames.contains(TRANSCIPTION_STORE_NAME)) {
-        store = db.createObjectStore(TRANSCIPTION_STORE_NAME, {
-            keyPath: "id",
-        });
-    } else if (transaction) {
-        store = transaction.objectStore(TRANSCIPTION_STORE_NAME);
-    }
-
-    if (!store) {
-        return;
-    }
-
-    if (!store.indexNames.contains("status")) {
-        store.createIndex("status", "status", {
-            unique: false,
-        });
-    }
-
-    if (!store.indexNames.contains("mediaFileId")) {
-        store.createIndex("mediaFileId", "mediaFileId", {
-            unique: false,
-        });
-    }
-
-    if (!store.indexNames.contains("createdAt")) {
-        store.createIndex("createdAt", "createdAt", {
-            unique: false,
-        });
-    }
-}
-
-function createTaskStore(db: IDBDatabase, transaction: IDBTransaction | null) {
-    let store: IDBObjectStore | undefined;
-
-    if (!db.objectStoreNames.contains(TASK_STORE_NAME)) {
-        store = db.createObjectStore(TASK_STORE_NAME, {
-            keyPath: "id",
-        });
-    } else if (transaction) {
-        store = transaction.objectStore(TASK_STORE_NAME);
-    }
-
-    if (!store) {
-        return;
-    }
-
-    if (!store.indexNames.contains("status")) {
-        store.createIndex("status", "status", {
-            unique: false,
-        });
-    }
-
-    if (!store.indexNames.contains("mediaFileId")) {
-        store.createIndex("mediaFileId", "mediaFileId", {
-            unique: false,
-        });
-    }
-}
-
-/**
- * Run data migrations based on version changes
- */
-async function runDataMigrations(
-    db: IDBDatabase,
-    oldVersion: number,
-    newVersion: number,
-): Promise<void> {
-    console.log(
-        `Running data migrations from version ${oldVersion} to ${newVersion}`,
-    );
-
-    // Migration from version 1 to version 2: Add summary field
-    if (oldVersion < 2 && newVersion >= 2) {
-        await migrateDataToV2(db);
-    }
-
-    // Future migrations can be added here
-    // if (oldVersion < 3 && newVersion >= 3) {
-    //     await migrateDataToV3(db);
-    // }
-}
-
-/**
- * Data migration from v1 to v2: Add summary field to transcriptions
- */
-async function migrateDataToV2(db: IDBDatabase): Promise<void> {
-    console.log(
-        "Running data migration to v2: Adding summary field to transcriptions",
-    );
-
-    return new Promise<void>((resolve, reject) => {
-        const transaction = db.transaction(
-            [TRANSCIPTION_STORE_NAME],
-            "readwrite",
-        );
-        const store = transaction.objectStore(TRANSCIPTION_STORE_NAME);
-        const request = store.openCursor();
-
-        let processed = 0;
-        let updated = 0;
-
-        request.onsuccess = (event) => {
-            const cursor = (event.target as IDBRequest).result;
-
-            if (cursor) {
-                const transcription = cursor.value;
-                processed++;
-
-                // Only update if summary field doesn't exist
-                if (!Object.hasOwn(transcription, "summary")) {
-                    transcription.summary = undefined;
-
-                    const updateRequest = cursor.update(transcription);
-
-                    updateRequest.onsuccess = () => {
-                        updated++;
-                        cursor.continue();
-                    };
-
-                    updateRequest.onerror = () => {
-                        console.error(
-                            "Failed to update transcription during migration:",
-                            updateRequest.error,
-                        );
-                        reject(
-                            new Error(
-                                `Migration failed: ${updateRequest.error?.message}`,
-                            ),
-                        );
-                    };
-                } else {
-                    // Record already has summary field, just continue
-                    cursor.continue();
-                }
-            } else {
-                // No more records
-                console.log(
-                    `Migration to v2 completed: ${updated} records updated out of ${processed} processed`,
-                );
-                resolve();
-            }
-        };
-
-        request.onerror = () => {
-            console.error(
-                "Failed to open cursor for migration:",
-                request.error,
-            );
-            reject(new Error(`Migration failed: ${request.error?.message}`));
-        };
-
-        transaction.onerror = () => {
-            console.error(
-                "Transaction failed during migration:",
-                transaction.error,
-            );
-            reject(
-                new Error(
-                    `Migration transaction failed: ${transaction.error?.message}`,
-                ),
-            );
-        };
-    });
-}
diff --git a/app/stores/db.ts b/app/stores/db.ts
new file mode 100644
index 0000000..d5be2d8
--- /dev/null
+++ b/app/stores/db.ts
@@ -0,0 +1,14 @@
+import { Dexie, type EntityTable } from "dexie";
+import type { StoredTranscription } from "~/types/storedTranscription";
+import type { StoredTask } from "~/types/task";
+
+export const db = new Dexie("transcribo-db") as Dexie & {
+    tasks: EntityTable<StoredTask, "id">;
+    transcriptions: EntityTable<StoredTranscription, "id">;
+};
+
+db.version(3).stores({
+    tasks: "id, status, mediaFile, mediaFileName, createdAt",
+    transcriptions:
+        "id, segments, name, createdAt, updatedAt, audioFiledId, mediaFile, mediaFileName, summary",
+});
diff --git a/app/stores/tasksStore.ts b/app/stores/tasksStore.ts
deleted file mode 100644
index 0570b6e..0000000
--- a/app/stores/tasksStore.ts
+++ /dev/null
@@ -1,314 +0,0 @@
-import { defineStore } from "pinia";
-import { initDB } from "~/services/indexDbService";
-import type { TaskStatus } from "~/types/task";
-
-// Define the structure of a stored task
-export interface StoredTask {
-    id: string;
-    status: TaskStatus;
-    mediaFile?: Blob;
-    mediaFileName?: string;
-    createdAt?: number; // Timestamp when task was created
-}
-
-// Database configuration
-const STORE_NAME = "tasks";
-// Define retention period (1 day in milliseconds)
-const RETENTION_PERIOD_MS = 24 * 60 * 60 * 1000;
-
-export const useTasksStore = defineStore("tasksStore", () => {
-    const logger = useLogger();
-
-    // State as refs
-    const tasks = ref<StoredTask[]>([]);
-    const isLoading = ref(false);
-    const error = ref<string | null>(null);
-    const db = ref<IDBDatabase | null>(null);
-
-    /**
-     * Initialize the IndexedDB database for tasks
-     */
-    async function initializeDB(): Promise<void> {
-        try {
-            db.value = await initDB();
-            isLoading.value = false;
-            await loadAllTasks();
-            await cleanupOldTasks();
-        } catch (e: unknown) {
-            if (e instanceof Error) {
-                logger.error(e.message);
-            } else {
-                logger.error("Unknown error initializing database", e);
-            }
-
-            isLoading.value = false;
-        }
-    }
-
-    /**
-     * Load all tasks from IndexedDB
-     * Note: This doesn't load media blobs by default to save memory
-     */
-    async function loadAllTasks(): Promise<StoredTask[]> {
-        if (!db.value) await initializeDB();
-
-        return new Promise<StoredTask[]>((resolve, reject) => {
-            if (!db.value) {
-                throw new Error("Database initialization failed");
-            }
-
-            isLoading.value = true;
-
-            const transaction = db.value.transaction(STORE_NAME, "readonly");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.getAll();
-
-            request.onsuccess = () => {
-                // Store tasks but remove the media blobs to save memory
-                tasks.value = request.result.map((task) => {
-                    // Create a copy without the mediaFile blob
-                    const { mediaFile: _, ...restOfTask } = task;
-                    return restOfTask;
-                });
-                isLoading.value = false;
-                resolve(tasks.value);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to load tasks: ${(event.target as IDBRequest).error?.message}`;
-                isLoading.value = false;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Get a single task by ID
-     * @param id The task ID
-     */
-    async function getTask(id: string): Promise<StoredTask | null> {
-        if (!db.value) await initializeDB();
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                throw new Error("Database initialization failed");
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readonly");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.get(id);
-
-            request.onsuccess = () => {
-                if (!request.result) {
-                    resolve(null);
-                    return;
-                }
-
-                resolve(request.result);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to get task: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Add a new task to the store with optional media file
-     */
-    async function addTask(
-        status: TaskStatus,
-        mediaFile?: File | Blob,
-        mediaFileName?: string,
-    ): Promise<StoredTask> {
-        if (!db.value) await initializeDB();
-
-        // Create a new task with ID and timestamps
-        const newTask: StoredTask = {
-            id: status.task_id,
-            status,
-            createdAt: Date.now(), // Add creation timestamp
-        };
-
-        // Add media file if provided
-        if (mediaFile) {
-            newTask.mediaFile = mediaFile;
-            newTask.mediaFileName = mediaFileName ?? "media-file";
-        }
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                throw new Error("Database initialization failed");
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.add(newTask);
-
-            request.onsuccess = () => {
-                // Add to local state, but without the media blob
-                const { mediaFile: _, ...taskWithoutMedia } = newTask;
-                tasks.value.push(taskWithoutMedia);
-                resolve(newTask);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to add task: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Update an existing task
-     */
-    async function updateTask(
-        id: string,
-        updates: Partial<Omit<StoredTask, "id" | "createdAt" | "updatedAt">>,
-        mediaFile?: File | Blob,
-        mediaFileName?: string,
-    ): Promise<StoredTask> {
-        if (!db.value) await initializeDB();
-
-        // First get the existing task with media
-        const existingTask = await getTask(id);
-
-        if (!existingTask) {
-            error.value = `Task with ID ${id} not found`;
-            throw new Error(error.value);
-        }
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                throw new Error("Database initialization failed");
-            }
-
-            // Create a deep clone of the existing task
-            const clonedTask = JSON.parse(
-                JSON.stringify(existingTask),
-            ) as StoredTask;
-
-            // Update the task with new data and update timestamp
-            const updatedTask: StoredTask = {
-                ...clonedTask,
-                ...(updates.status !== undefined
-                    ? { status: updates.status }
-                    : {}),
-                ...(updates.mediaFileName
-                    ? { mediaFileName: updates.mediaFileName }
-                    : {}),
-            };
-
-            if (mediaFile) {
-                // Update media file if provided
-                updatedTask.mediaFile = mediaFile;
-                updatedTask.mediaFileName = mediaFileName ?? "media-file";
-            } else if (existingTask.mediaFile) {
-                // Keep the existing media file if present
-                updatedTask.mediaFile = existingTask.mediaFile;
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.put(updatedTask);
-
-            request.onsuccess = () => {
-                // Update local state, but without the media blob
-                const { mediaFile: _, ...taskWithoutMedia } = updatedTask;
-
-                const index = tasks.value.findIndex((t) => t.id === id);
-                if (index !== -1) {
-                    tasks.value[index] = taskWithoutMedia;
-                }
-
-                resolve(updatedTask);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to update task: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Delete a task
-     */
-    async function deleteTask(id: string): Promise<void> {
-        if (!db.value) await initializeDB();
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                throw new Error("Database initialization failed");
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.delete(id);
-
-            request.onsuccess = () => {
-                // Update local state
-                tasks.value = tasks.value.filter((t) => t.id !== id);
-                resolve();
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to delete task: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Clean up tasks older than the retention period (1 day)
-     * @returns The number of tasks deleted
-     */
-    async function cleanupOldTasks(): Promise<number> {
-        if (!db.value) await initializeDB();
-
-        // Get all tasks including their creation timestamps
-        const allTasks = await loadAllTasks();
-        const now = Date.now();
-        let deletedCount = 0;
-
-        // Find tasks older than the retention period
-        const oldTaskIds = allTasks
-            .filter(
-                (task) =>
-                    task.createdAt &&
-                    now - task.createdAt > RETENTION_PERIOD_MS,
-            )
-            .map((task) => task.id);
-
-        // Delete each old task
-        for (const taskId of oldTaskIds) {
-            try {
-                await deleteTask(taskId);
-                deletedCount++;
-            } catch (error) {
-                logger.error(`Failed to delete old task ${taskId}:`, error);
-            }
-        }
-
-        logger.info(`Cleaned up ${deletedCount} tasks older than 1 day`);
-        return deletedCount;
-    }
-
-    return {
-        // State
-        tasks,
-        isLoading,
-        error,
-        db,
-
-        // Actions
-        initDB: initializeDB,
-        loadAllTasks,
-        getTask,
-        addTask,
-        updateTask,
-        deleteTask,
-        cleanupOldTasks,
-    };
-});
diff --git a/app/stores/transcriptionsStore.ts b/app/stores/transcriptionsStore.ts
deleted file mode 100644
index 78b04c7..0000000
--- a/app/stores/transcriptionsStore.ts
+++ /dev/null
@@ -1,701 +0,0 @@
-import { isApiError } from "@dcc-bs/communication.bs.js";
-import { defineStore } from "pinia";
-import { v4 as uuidv4 } from "uuid";
-import { initDB } from "~/services/indexDbService";
-import { SummaryResponseSchema } from "~/types/summarizeResponse";
-import type { StoredTranscription } from "../types/storedTranscription";
-
-// Database configuration
-const STORE_NAME = "transcriptions";
-// Define retention period (30 days in milliseconds)
-export const TRANSCRIPTION_RETENTION_PERIOD_MS = 30 * 24 * 60 * 60 * 1000;
-
-/**
- * Store to manage transcriptions with IndexedDB persistence
- */
-export const useTranscriptionsStore = defineStore("transcriptions", () => {
-    // State
-    const transcriptions = ref<StoredTranscription[]>([]);
-    const currentTranscription = ref<StoredTranscription | undefined>(
-        undefined,
-    );
-    const isLoading = ref(false);
-    const error = ref<string | null>(null);
-    const db = ref<IDBDatabase | null>(null);
-    const isSummaryGenerating = ref(false);
-    const { apiFetch } = useApi();
-
-    const logger = useLogger();
-
-    /**
-     * Initialize the IndexedDB database
-     */
-    async function initializeDB(): Promise<void> {
-        try {
-            db.value = await initDB();
-            isLoading.value = false;
-            await loadAllTranscriptions();
-        } catch (e: unknown) {
-            if (e instanceof Error) {
-                logger.error(e.message);
-            } else {
-                logger.error("Unknown error initializing database", e);
-            }
-
-            isLoading.value = false;
-        }
-    }
-
-    /**
-     * Load all transcriptions from IndexedDB
-     * Note: This doesn't load audio blobs by default to save memory
-     */
-    async function loadAllTranscriptions(): Promise<StoredTranscription[]> {
-        if (!db.value) await initializeDB();
-
-        return new Promise<StoredTranscription[]>((resolve, reject) => {
-            if (!db.value) {
-                error.value = "Database not initialized";
-                reject(new Error(error.value));
-                return;
-            }
-
-            isLoading.value = true;
-
-            const transaction = db.value.transaction(STORE_NAME, "readonly");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.getAll();
-
-            request.onsuccess = () => {
-                // Store transcriptions but remove the audio blobs to save memory
-                transcriptions.value = request.result.map((transcription) => {
-                    // Create a copy without the audioFile blob
-                    const { mediaFile: _, ...restOfTranscription } =
-                        transcription;
-                    return restOfTranscription;
-                });
-                isLoading.value = false;
-                resolve(transcriptions.value);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to load transcriptions: ${(event.target as IDBRequest).error?.message}`;
-                isLoading.value = false;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Clean up transcriptions older than the retention period (30 days)
-     * @returns The number of transcriptions deleted
-     */
-    async function cleanupOldTranscriptions(): Promise<number> {
-        if (!db.value) await initializeDB();
-
-        const localDb = db.value;
-        if (!localDb) {
-            logger.error("Database not initialized for cleanup.");
-            return 0;
-        }
-
-        return new Promise((resolve, reject) => {
-            const transaction = localDb.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-
-            let index: IDBIndex;
-            try {
-                index = store.index("createdAt");
-            } catch (e: unknown) {
-                logger.error(
-                    "createdAt index missing on transcriptions store.",
-                    e,
-                );
-                if (e instanceof Error) {
-                    reject(e);
-                } else {
-                    reject(
-                        new Error(
-                            "Failed to access createdAt index during cleanup.",
-                        ),
-                    );
-                }
-                return;
-            }
-
-            const thresholdDate = new Date(
-                Date.now() - TRANSCRIPTION_RETENTION_PERIOD_MS,
-            );
-            // Iterate via the createdAt index to avoid loading the entire dataset
-            const range = IDBKeyRange.upperBound(thresholdDate);
-            let deletedCount = 0;
-
-            const request = index.openKeyCursor(range);
-
-            request.onsuccess = () => {
-                const cursor = request.result;
-                if (cursor) {
-                    const deleteRequest = store.delete(cursor.primaryKey);
-
-                    deleteRequest.onerror = () => {
-                        logger.error(
-                            `Failed to delete transcription ${String(cursor.primaryKey)} during cleanup:`,
-                            deleteRequest.error,
-                        );
-                    };
-
-                    deletedCount++;
-                    cursor.continue();
-                    return;
-                }
-
-                if (deletedCount > 0) {
-                    logger.info(
-                        `Cleaned up ${deletedCount} transcriptions older than 30 days`,
-                    );
-                }
-                resolve(deletedCount);
-            };
-
-            request.onerror = () => {
-                logger.error(
-                    "Failed to iterate over transcription index during cleanup:",
-                    request.error,
-                );
-                reject(request.error);
-            };
-
-            transaction.onerror = () => {
-                logger.error(
-                    "Transaction error during transcription cleanup:",
-                    transaction.error,
-                );
-                reject(transaction.error);
-            };
-        });
-    }
-
-    /**
-     * Get a single transcription by ID
-     * @param id The transcription ID
-     * @param includeAudio Whether to include the audio blob (default: false)
-     */
-    async function getTranscription(
-        id: string,
-        includeAudio = false,
-    ): Promise<StoredTranscription | null> {
-        if (!db.value) await initializeDB();
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                error.value = "Database not initialized";
-                reject(new Error(error.value));
-                return;
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readonly");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.get(id);
-
-            request.onsuccess = () => {
-                if (!request.result) {
-                    resolve(null);
-                    return;
-                }
-
-                // If includeAudio is false, remove the audio blob to save memory
-                if (!includeAudio && request.result.audioFile) {
-                    const { mediaFile: _, ...transcriptionWithoutAudio } =
-                        request.result;
-                    resolve(transcriptionWithoutAudio);
-                } else {
-                    resolve(request.result);
-                }
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to get transcription: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Get only the audio file blob for a transcription
-     */
-    async function getAudioFile(id: string): Promise<Blob | null> {
-        if (!db.value) await initializeDB();
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                error.value = "Database not initialized";
-                reject(new Error(error.value));
-                return;
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readonly");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.get(id);
-
-            request.onsuccess = () => {
-                if (!request.result?.audioFile) {
-                    resolve(null);
-                    return;
-                }
-                resolve(request.result.audioFile);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to get audio file: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Add a new transcription to the store with optional audio file
-     */
-    async function addTranscription(
-        transcription: Omit<
-            StoredTranscription,
-            "id" | "createdAt" | "updatedAt"
-        >,
-        audioFile?: File | Blob,
-        audioFileName?: string,
-    ): Promise<StoredTranscription> {
-        if (!db.value) await initializeDB();
-
-        // Create a new transcription with ID and timestamps
-        const now = new Date();
-        const newTranscription: StoredTranscription = {
-            ...transcription,
-            id: uuidv4(), // Generate unique ID
-            // Use provided name if available, otherwise use mediaFileName or default
-            name:
-                transcription.name ||
-                audioFileName ||
-                `Transcription ${now.toLocaleString()}`,
-            createdAt: now,
-            updatedAt: now,
-        };
-
-        // Add audio file if provided
-        if (audioFile) {
-            newTranscription.mediaFile = audioFile;
-            newTranscription.mediaFileName = audioFileName ?? "audio-file";
-
-            // If name wasn't explicitly set and we have a mediaFileName, use that
-            if (!transcription.name && audioFileName) {
-                newTranscription.name = audioFileName;
-            }
-
-            // Generate a unique audioFileId
-            newTranscription.audioFileId = uuidv4();
-        }
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                error.value = "Database not initialized";
-                reject(new Error(error.value));
-                return;
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.add(newTranscription);
-
-            request.onsuccess = () => {
-                // Add to local state, but without the audio blob
-                const { mediaFile: _, ...transcriptionWithoutAudio } =
-                    newTranscription;
-                transcriptions.value.push(transcriptionWithoutAudio);
-                resolve(newTranscription);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to add transcription: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Set the current transcription by ID
-     */
-    async function setCurrentTranscription(id: string): Promise<void> {
-        const transcription = await getTranscription(id, true);
-        if (!transcription) {
-            throw new Error(`Transcription with ID ${id} not found`);
-        }
-
-        currentTranscription.value = transcription;
-    }
-
-    /**
-     * Update the current transcription
-     */
-    async function updateCurrentTranscription(
-        updates: Partial<
-            Omit<StoredTranscription, "id" | "createdAt" | "updatedAt">
-        >,
-    ): Promise<void> {
-        if (!currentTranscription.value) {
-            throw new Error("No current transcription set");
-        }
-
-        const newTranscription = await updateTranscription(
-            currentTranscription.value.id,
-            updates,
-        );
-        currentTranscription.value = newTranscription;
-    }
-
-    /**
-     * Update an existing transcription
-     */
-    async function updateTranscription(
-        id: string,
-        updates: Partial<
-            Omit<StoredTranscription, "id" | "createdAt" | "updatedAt">
-        >,
-        audioFile?: File | Blob,
-        audioFileName?: string,
-    ): Promise<StoredTranscription> {
-        if (!db.value) await initializeDB();
-
-        // First get the existing transcription with audio
-        const existingTranscription = await getTranscription(id, true);
-
-        if (!existingTranscription) {
-            error.value = `Transcription with ID ${id} not found`;
-            throw new Error(error.value);
-        }
-
-        // Create a new Promise with non-async executor function
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                error.value = "Database not initialized";
-                reject(new Error(error.value));
-                return;
-            }
-
-            const clonedTranscription = JSON.parse(
-                JSON.stringify(existingTranscription),
-            ) as StoredTranscription;
-
-            // Update the transcription with new data and update timestamp
-            const updatedTranscription: StoredTranscription = {
-                ...clonedTranscription,
-                // Only apply updates for properties that exist in the updates object
-                ...(updates.segments
-                    ? { segments: JSON.parse(JSON.stringify(updates.segments)) }
-                    : {}),
-                ...(updates.mediaFileName
-                    ? { mediaFileName: updates.mediaFileName }
-                    : {}),
-                ...(updates.audioFileId
-                    ? { audioFileId: updates.audioFileId }
-                    : {}),
-                ...(updates.name ? { name: updates.name } : {}), // Apply name updates if present
-                ...(updates.summary !== undefined
-                    ? { summary: updates.summary }
-                    : {}), // Apply summary updates if present
-                updatedAt: new Date(),
-            };
-
-            // Update audio file if provided
-            if (audioFile) {
-                updatedTranscription.mediaFile = audioFile;
-                updatedTranscription.mediaFileName =
-                    audioFileName ?? "audio-file";
-
-                // If updating audio and name wasn't provided in updates, update name to match new audio filename
-                if (
-                    !updates.name &&
-                    audioFileName &&
-                    !clonedTranscription.name
-                ) {
-                    updatedTranscription.name = audioFileName;
-                }
-
-                // Generate a new audioFileId if one doesn't already exist
-                if (!updatedTranscription.audioFileId) {
-                    updatedTranscription.audioFileId = uuidv4();
-                }
-            } else if (existingTranscription.mediaFile) {
-                // Keep the existing media file if present
-                updatedTranscription.mediaFile =
-                    existingTranscription.mediaFile;
-            }
-
-            // Validate data before writing to IndexedDB
-            // Ensure segments array is serializable
-            if (updatedTranscription.segments) {
-                // Check if segments is actually an array
-                if (!Array.isArray(updatedTranscription.segments)) {
-                    logger.error(
-                        "Segments is not an array:",
-                        updatedTranscription.segments,
-                    );
-                    reject(new Error("Segments must be an array"));
-                    return;
-                }
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.put(updatedTranscription);
-
-            request.onsuccess = () => {
-                // Update local state, but without the audio blob
-                const { mediaFile: _, ...transcriptionWithoutAudio } =
-                    updatedTranscription;
-
-                const index = transcriptions.value.findIndex(
-                    (t) => t.id === id,
-                );
-                if (index !== -1) {
-                    transcriptions.value[index] = transcriptionWithoutAudio;
-                }
-
-                resolve(updatedTranscription);
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to update transcription: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Delete a transcription
-     */
-    async function deleteTranscription(id: string): Promise<void> {
-        if (!db.value) await initializeDB();
-
-        return new Promise((resolve, reject) => {
-            if (!db.value) {
-                error.value = "Database not initialized";
-                reject(new Error(error.value));
-                return;
-            }
-
-            const transaction = db.value.transaction(STORE_NAME, "readwrite");
-            const store = transaction.objectStore(STORE_NAME);
-            const request = store.delete(id);
-
-            request.onsuccess = () => {
-                // Update local state
-                transcriptions.value = transcriptions.value.filter(
-                    (t) => t.id !== id,
-                );
-                resolve();
-            };
-
-            request.onerror = (event) => {
-                error.value = `Failed to delete transcription: ${(event.target as IDBRequest).error?.message}`;
-                reject(new Error(error.value));
-            };
-        });
-    }
-
-    /**
-     * Get the complete text from all segments
-     */
-    function getTranscriptionText(transcription: StoredTranscription): string {
-        // Helper method to extract text from segments
-        return transcription.segments.map((segment) => segment.text).join(" ");
-    }
-
-    /**
-     * Helper function to validate and sanitize transcript text
-     */
-    function validateAndSanitizeTranscriptText(text: string): string {
-        if (!text || typeof text !== "string") {
-            throw new Error(
-                "Transcript text is required and must be a string.",
-            );
-        }
-
-        // Trim whitespace
-        const trimmedText = text.trim();
-
-        if (trimmedText.length === 0) {
-            throw new Error("Transcript text cannot be empty.");
-        }
-
-        // Check minimum length (at least 10 characters for meaningful content)
-        const MIN_LENGTH = 10;
-        if (trimmedText.length < MIN_LENGTH) {
-            throw new Error(
-                `Transcript text must be at least ${MIN_LENGTH} characters long.`,
-            );
-        }
-
-        // Check maximum length to prevent oversized requests
-        const MAX_LENGTH = 32000 * 4;
-        if (trimmedText.length > MAX_LENGTH) {
-            throw new Error(
-                `Transcript text is too large. Maximum allowed length is ${MAX_LENGTH} characters.`,
-            );
-        }
-
-        return trimmedText;
-    }
-
-    // Computed properties (getters)
-
-    /**
-     * Get transcription count
-     */
-    const transcriptionCount = computed(() => {
-        return transcriptions.value.length;
-    });
-
-    /**
-     * Get transcriptions with audio files
-     */
-    const transcriptionsWithAudio = computed(() => {
-        return transcriptions.value.filter((t) => t.audioFileId);
-    });
-
-    /**
-     * Filter transcriptions by search query
-     */
-    function searchTranscriptions(query: string): StoredTranscription[] {
-        const lowerQuery = query.toLowerCase();
-        return transcriptions.value.filter((transcription) => {
-            // Search through all segment texts
-            const fullText = transcription.segments
-                .map((segment) => segment.text)
-                .join(" ")
-                .toLowerCase();
-
-            return fullText.includes(lowerQuery);
-        });
-    }
-
-    /**
-     * Generate and store a summary for the current transcription
-     */
-    async function generateSummary(): Promise<string | null> {
-        if (!currentTranscription.value) {
-            throw new Error(
-                "No current transcription available for summary generation.",
-            );
-        }
-
-        // Prevent concurrent calls
-        if (isSummaryGenerating.value) {
-            throw new Error(
-                "Summary generation is already in progress for this transcription.",
-            );
-        }
-
-        const isRegeneration = !!currentTranscription.value.summary;
-
-        try {
-            isSummaryGenerating.value = true;
-
-            // If regenerating, clear the existing summary immediately
-            if (isRegeneration) {
-                currentTranscription.value = {
-                    ...currentTranscription.value,
-                    summary: undefined,
-                };
-            }
-
-            const transcriptText = getTranscriptionText(
-                currentTranscription.value,
-            );
-
-            // Validate and sanitize transcript text
-            const sanitizedText =
-                validateAndSanitizeTranscriptText(transcriptText);
-
-            const formData = new FormData();
-            formData.append("transcript", sanitizedText);
-
-            const summaryResponse = await apiFetch("/api/summarize/submit", {
-                schema: SummaryResponseSchema,
-                method: "POST",
-                body: formData,
-            });
-
-            if (isApiError(summaryResponse)) {
-                throw summaryResponse;
-            }
-
-            const summary = summaryResponse.summary;
-
-            // Store the summary in the current transcription with proper reactivity
-            currentTranscription.value = {
-                ...currentTranscription.value,
-                summary: summary,
-            };
-
-            // Update the transcription in IndexedDB
-            await updateCurrentTranscription({
-                summary: summary,
-            });
-
-            return summary;
-        } catch (error) {
-            logger.error("Failed to generate summary:", error);
-            throw error;
-        } finally {
-            isSummaryGenerating.value = false;
-        }
-    }
-
-    // Initialize the store when it's first accessed
-    onMounted(() => {
-        async function bootstrapStore(): Promise<void> {
-            try {
-                // Initialize the database before running maintenance tasks
-                await initializeDB();
-                // Perform cleanup separately to avoid coupling it to initialization
-                await cleanupOldTranscriptions();
-            } catch (e: unknown) {
-                if (e instanceof Error) {
-                    logger.error(e.message);
-                } else {
-                    logger.error("Failed to bootstrap transcription store", e);
-                }
-            }
-        }
-
-        void bootstrapStore();
-    });
-
-    return {
-        // State
-        transcriptions,
-        currentTranscription,
-        isLoading,
-        error,
-        isSummaryGenerating,
-
-        // Actions
-        initializeDB,
-        loadAllTranscriptions,
-        getTranscription,
-        getAudioFile,
-        addTranscription,
-        setCurrentTranscription,
-        updateCurrentTranscription,
-        updateTranscription,
-        deleteTranscription,
-        getTranscriptionText,
-        generateSummary,
-
-        // Getters
-        transcriptionCount,
-        transcriptionsWithAudio,
-        searchTranscriptions,
-
-        // Maintenance
-        cleanupOldTranscriptions,
-    };
-});
diff --git a/app/types/commands.ts b/app/types/commands.ts
index 94f0823..37ca13e 100644
--- a/app/types/commands.ts
+++ b/app/types/commands.ts
@@ -1,8 +1,9 @@
 import type { ICommand, IReversibleCommand } from "#build/types/commands";
+import type { EditorMode } from "./editor";
 import type { TaskStatus } from "./task";
 import type {
-    SegementWithId,
     Segment,
+    SegmentWithId,
     TranscriptionResponse,
 } from "./transcriptionResponse";
 
@@ -12,14 +13,16 @@ export const Cmds = {
     TranscriptionFinishedCommand: "TranscriptionFinishedCommand",
     SeekToSecondsCommand: "SeekToSecondsCommand",
     TogglePlayCommand: "TogglePlayCommand",
-    InsertSegementCommand: "InsertSegementCommand",
-    DeleteSegementCommand: "DeleteSegementCommand",
-    UpdateSegementCommand: "UpdateSegementCommand",
-    TranscriptonNameChangeCommand: "TranscriptonNameChangeCommand",
+    InsertSegmentCommand: "InsertSegmentCommand",
+    DeleteSegmentCommand: "DeleteSegmentCommand",
+    UpdateSegmentCommand: "UpdateSegmentCommand",
+    TranscriptionNameChangeCommand: "TranscriptionNameChangeCommand",
     RenameSpeakerCommand: "RenameSpeakerCommand",
     EmptyCommand: "EmptyCommand",
     AddSegmentCommand: "AddSegmentCommand",
     RestoreSegmentCommand: "RestoreSegmentCommand",
+    ChangeEditorModeCommand: "ChangeEditorModeCommand",
+    ShowOnboardingCommand: "ShowOnboardingCommand",
 };
 
 export type ITransriboReversibleCommand = IReversibleCommand & {
@@ -157,20 +160,20 @@ export class AddSegmentCommand implements ITransriboReversibleCommand {
     readonly $type = "AddSegmentCommand";
     $undoCommand: ICommand = new EmptyCommand();
 
-    constructor(public readonly newSegement: Segment) {}
+    constructor(public readonly newSegment: Segment) {}
 
     public setUndoCommand(undoCommand: ICommand) {
         this.$undoCommand = undoCommand;
     }
 }
 
-export class InsertSegementCommand implements ITransriboReversibleCommand {
-    readonly $type = "InsertSegementCommand";
+export class InsertSegmentCommand implements ITransriboReversibleCommand {
+    readonly $type = "InsertSegmentCommand";
     $undoCommand: ICommand = new EmptyCommand();
 
     constructor(
         public readonly targetSegmentId: string,
-        public readonly newSegement: Partial<Segment>,
+        public readonly newSegment: Partial<Segment>,
         public readonly direction: "before" | "after",
     ) {}
 
@@ -197,7 +200,7 @@ export class InsertSegementCommand implements ITransriboReversibleCommand {
 export class RestoreSegmentCommand implements ICommand {
     readonly $type = "RestoreSegmentCommand";
 
-    constructor(public readonly segmentData: SegementWithId) {}
+    constructor(public readonly segmentData: SegmentWithId) {}
 
     /**
      * Returns a string representation of the command
@@ -215,8 +218,8 @@ export class RestoreSegmentCommand implements ICommand {
     }
 }
 
-export class DeleteSegementCommand implements ITransriboReversibleCommand {
-    readonly $type = "DeleteSegementCommand";
+export class DeleteSegmentCommand implements ITransriboReversibleCommand {
+    readonly $type = "DeleteSegmentCommand";
     $undoCommand: ICommand = new EmptyCommand();
 
     constructor(public readonly segmentId: string) {}
@@ -241,8 +244,8 @@ export class DeleteSegementCommand implements ITransriboReversibleCommand {
     }
 }
 
-export class UpdateSegementCommand implements ITransriboReversibleCommand {
-    readonly $type = "UpdateSegementCommand";
+export class UpdateSegmentCommand implements ITransriboReversibleCommand {
+    readonly $type = "UpdateSegmentCommand";
     $undoCommand: ICommand = new EmptyCommand();
 
     constructor(
@@ -281,10 +284,10 @@ export class UpdateSegementCommand implements ITransriboReversibleCommand {
     }
 }
 
-export class TranscriptonNameChangeCommand
+export class TranscriptionNameChangeCommand
     implements ITransriboReversibleCommand
 {
-    readonly $type = "TranscriptonNameChangeCommand";
+    readonly $type = "TranscriptionNameChangeCommand";
     $undoCommand: ICommand = new EmptyCommand();
 
     constructor(public readonly newName: string) {}
@@ -341,3 +344,43 @@ export class RenameSpeakerCommand implements ITransriboReversibleCommand {
         });
     }
 }
+
+export class ChangeEditorModeCommand implements ICommand {
+    readonly $type = "ChangeEditorModeCommand";
+
+    constructor(public readonly newMode: EditorMode) {}
+
+    /**
+     * Returns a string representation of the command
+     */
+    toString(): string {
+        return `Change Editor Mode To: ${this.newMode}`;
+    }
+
+    /**
+     * Returns a localized string representation of the command
+     * @param t - Translation function from useI18n
+     */
+    toLocaleString(t: (key: string, params?: object) => string): string {
+        return t("commands.changeEditorMode", { mode: this.newMode });
+    }
+}
+
+export class ShowOnboardingCommand implements ICommand {
+    readonly $type = "ShowOnboardingCommand";
+
+    /**
+     * Returns a string representation of the command
+     */
+    toString(): string {
+        return "Start Onboarding";
+    }
+
+    /**
+     * Returns a localized string representation of the command
+     * @param t - Translation function from useI18n
+     */
+    toLocaleString(t: (key: string, params?: object) => string): string {
+        return t("commands.startOnboarding");
+    }
+}
diff --git a/app/types/editor.ts b/app/types/editor.ts
new file mode 100644
index 0000000..8306082
--- /dev/null
+++ b/app/types/editor.ts
@@ -0,0 +1 @@
+export type EditorMode = "view" | "summary" | "edit" | "statistics";
diff --git a/app/types/mediaProgress.ts b/app/types/mediaProgress.ts
new file mode 100644
index 0000000..cac3663
--- /dev/null
+++ b/app/types/mediaProgress.ts
@@ -0,0 +1,11 @@
+export type MediaProgress = {
+    icon: string;
+    message: string;
+
+    // between 0 and 100
+    progress: number | null;
+};
+
+export function getProgress(progress: MediaProgress): number {
+    return !progress.progress ? 0 : progress.progress;
+}
diff --git a/app/types/mediaStepInOut.ts b/app/types/mediaStepInOut.ts
new file mode 100644
index 0000000..47a5fe6
--- /dev/null
+++ b/app/types/mediaStepInOut.ts
@@ -0,0 +1,16 @@
+export type MediaSelectionData = {
+    media: File;
+};
+
+export type MediaConfigureData = {
+    media: File;
+    numSpeaker: string;
+    language: string;
+};
+
+export type MediaProcessData = {
+    originalMedia: File;
+    processedMedia: File;
+    numSpeaker: number | undefined;
+    language: string | undefined;
+};
diff --git a/app/types/task.ts b/app/types/task.ts
index aef7912..252a338 100644
--- a/app/types/task.ts
+++ b/app/types/task.ts
@@ -36,8 +36,8 @@ export const TaskStatusEnum = {
 export const TaskStatusSchema = z.object({
     task_id: z.string(),
     status: TaskStatusEnumSchema,
-    created_at: z.string().nullable(), // ISO date string or null
-    executed_at: z.string().nullable(), // ISO date string or null
+    created_at: z.coerce.date().optional(), // ISO date string or null
+    executed_at: z.coerce.date().optional(), // ISO date string or null
     progress: z.number().nullable(),
 });
 
@@ -46,3 +46,13 @@ export const TaskStatusSchema = z.object({
  * Inferred from TaskStatusSchema
  */
 export type TaskStatus = z.infer<typeof TaskStatusSchema>;
+
+export const StoredTaskSchema = z.object({
+    id: z.string(),
+    status: TaskStatusSchema,
+    mediaFile: z.instanceof(Blob).optional(),
+    mediaFileName: z.string().optional(),
+    createdAt: z.date().optional(),
+});
+
+export type StoredTask = z.infer<typeof StoredTaskSchema>;
diff --git a/app/types/transcriptionResponse.ts b/app/types/transcriptionResponse.ts
index 600f8e5..c5697f0 100644
--- a/app/types/transcriptionResponse.ts
+++ b/app/types/transcriptionResponse.ts
@@ -48,7 +48,7 @@ export const SegmentWithIdSchema = SegmentSchema.extend({
  * Type representing a segment with an ID
  * Inferred from SegmentWithIdSchema
  */
-export type SegementWithId = z.infer<typeof SegmentWithIdSchema>;
+export type SegmentWithId = z.infer<typeof SegmentWithIdSchema>;
 
 /**
  * Zod schema for TranscriptionResponse
diff --git a/app/utils/animationPresets.ts b/app/utils/animationPresets.ts
new file mode 100644
index 0000000..615eab1
--- /dev/null
+++ b/app/utils/animationPresets.ts
@@ -0,0 +1,7 @@
+export const pageTransition = {
+    type: "spring" as const,
+    stiffness: 200,
+    damping: 25,
+};
+
+export const staggerDelay = 0.1;
diff --git a/app/utils/languages.ts b/app/utils/languages.ts
new file mode 100644
index 0000000..fd567ac
--- /dev/null
+++ b/app/utils/languages.ts
@@ -0,0 +1,76 @@
+/**
+ * Language interface defining the structure for language objects
+ */
+export interface Language {
+    code: string;
+    icon: string;
+}
+
+/**
+ * Array of supported languages with their language codes and flag icons
+ * Icons are sourced from https://icones.js.org/collection/flag
+ *
+ * Priority languages (de, en, fr, it) are at the top, followed by others alphabetically
+ */
+export const languages: Language[] = [
+    // Priority languages at the top
+    { code: "de", icon: "flag:de-4x3" }, // German - Germany
+    { code: "en-us", icon: "flag:us-4x3" }, // English - United States
+    { code: "en-gb", icon: "flag:gb-4x3" }, // English - United Kingdom
+    { code: "fr", icon: "flag:fr-4x3" }, // French - France
+    { code: "it", icon: "flag:it-4x3" }, // Italian - Italy
+    // Other languages alphabetically
+    { code: "af", icon: "flag:za-4x3" }, // Afrikaans - South Africa
+    { code: "ar", icon: "flag:sa-4x3" }, // Arabic - Saudi Arabia
+    { code: "bg", icon: "flag:bg-4x3" }, // Bulgarian - Bulgaria
+    { code: "bn", icon: "flag:bd-4x3" }, // Bengali - Bangladesh
+    { code: "ca", icon: "flag:es-ct-4x3" }, // Catalan - Catalonia
+    { code: "cs", icon: "flag:cz-4x3" }, // Czech - Czech Republic
+    { code: "cy", icon: "flag:gb-wls-4x3" }, // Welsh - Wales
+    { code: "da", icon: "flag:dk-4x3" }, // Danish - Denmark
+    { code: "el", icon: "flag:gr-4x3" }, // Greek - Greece
+    { code: "es", icon: "flag:es-4x3" }, // Spanish - Spain
+    { code: "et", icon: "flag:ee-4x3" }, // Estonian - Estonia
+    { code: "fa", icon: "flag:ir-4x3" }, // Persian - Iran
+    { code: "fi", icon: "flag:fi-4x3" }, // Finnish - Finland
+    { code: "gu", icon: "flag:in-4x3" }, // Gujarati - India
+    { code: "he", icon: "flag:il-4x3" }, // Hebrew - Israel
+    { code: "hi", icon: "flag:in-4x3" }, // Hindi - India
+    { code: "hr", icon: "flag:hr-4x3" }, // Croatian - Croatia
+    { code: "hu", icon: "flag:hu-4x3" }, // Hungarian - Hungary
+    { code: "id", icon: "flag:id-4x3" }, // Indonesian - Indonesia
+    { code: "ja", icon: "flag:jp-4x3" }, // Japanese - Japan
+    { code: "kn", icon: "flag:in-4x3" }, // Kannada - India
+    { code: "ko", icon: "flag:kr-4x3" }, // Korean - South Korea
+    { code: "lt", icon: "flag:lt-4x3" }, // Lithuanian - Lithuania
+    { code: "lv", icon: "flag:lv-4x3" }, // Latvian - Latvia
+    { code: "mk", icon: "flag:mk-4x3" }, // Macedonian - North Macedonia
+    { code: "ml", icon: "flag:in-4x3" }, // Malayalam - India
+    { code: "mr", icon: "flag:in-4x3" }, // Marathi - India
+    { code: "ne", icon: "flag:np-4x3" }, // Nepali - Nepal
+    { code: "nl", icon: "flag:nl-4x3" }, // Dutch - Netherlands
+    { code: "no", icon: "flag:no-4x3" }, // Norwegian - Norway
+    { code: "pa", icon: "flag:in-4x3" }, // Punjabi - India
+    { code: "pl", icon: "flag:pl-4x3" }, // Polish - Poland
+    { code: "pt", icon: "flag:pt-4x3" }, // Portuguese - Portugal
+    { code: "ro", icon: "flag:ro-4x3" }, // Romanian - Romania
+    { code: "ru", icon: "flag:ru-4x3" }, // Russian - Russia
+    { code: "sk", icon: "flag:sk-4x3" }, // Slovak - Slovakia
+    { code: "sl", icon: "flag:si-4x3" }, // Slovenian - Slovenia
+    { code: "so", icon: "flag:so-4x3" }, // Somali - Somalia
+    { code: "sq", icon: "flag:al-4x3" }, // Albanian - Albania
+    { code: "sv", icon: "flag:se-4x3" }, // Swedish - Sweden
+    { code: "sw", icon: "flag:tz-4x3" }, // Swahili - Tanzania
+    { code: "ta", icon: "flag:in-4x3" }, // Tamil - India
+    { code: "te", icon: "flag:in-4x3" }, // Telugu - India
+    { code: "th", icon: "flag:th-4x3" }, // Thai - Thailand
+    { code: "tl", icon: "flag:ph-4x3" }, // Filipino - Philippines
+    { code: "tr", icon: "flag:tr-4x3" }, // Turkish - Turkey
+    { code: "uk", icon: "flag:ua-4x3" }, // Ukrainian - Ukraine
+    { code: "ur", icon: "flag:pk-4x3" }, // Urdu - Pakistan
+    { code: "vi", icon: "flag:vn-4x3" }, // Vietnamese - Vietnam
+    { code: "zh-cn", icon: "flag:cn-4x3" }, // Chinese (Simplified) - China
+    { code: "zh-tw", icon: "flag:tw-4x3" }, // Chinese (Traditional) - Taiwan
+];
+
+export type LanguageCode = Language["code"];
diff --git a/app/utils/makrdownToDox.client.ts b/app/utils/makrdownToDox.client.ts
new file mode 100644
index 0000000..bbd4db0
--- /dev/null
+++ b/app/utils/makrdownToDox.client.ts
@@ -0,0 +1,16 @@
+/**
+ * Converts markdown content to a DOCX file blob
+ * @param markdown - The markdown content to convert
+ * @returns Promise<Blob> - The generated DOCX file as a blob
+ */
+export async function markdownToDocx(markdown: string): Promise<Blob> {
+    // Ensure this only runs on the client side
+    if (typeof window === "undefined") {
+        throw new Error("markdownToDocx can only be used on the client side");
+    }
+
+    // Dynamic import to prevent SSR issues
+    const { convertMarkdownToDocx } = await import("@mohtasham/md-to-docx");
+
+    return await convertMarkdownToDocx(markdown);
+}
diff --git a/app/utils/speakerStatistics.ts b/app/utils/speakerStatistics.ts
new file mode 100644
index 0000000..5bf96f0
--- /dev/null
+++ b/app/utils/speakerStatistics.ts
@@ -0,0 +1,48 @@
+import type { Segment } from "~/types/transcriptionResponse";
+
+export interface SpeakerStatistics {
+    speaker: string;
+    duration: number;
+    percentage: number;
+}
+
+export function computeSpeakerStatistics(
+    segments: Segment[],
+): SpeakerStatistics[] {
+    const speakerDurations = new Map<string, number>();
+
+    let totalDuration = 0;
+
+    for (const segment of segments) {
+        const speaker = segment.speaker ?? "unknown";
+        const segmentDuration = segment.end - segment.start;
+
+        const currentDuration = speakerDurations.get(speaker) ?? 0;
+        speakerDurations.set(speaker, currentDuration + segmentDuration);
+        totalDuration += segmentDuration;
+    }
+
+    const statistics: SpeakerStatistics[] = [];
+
+    for (const [speaker, duration] of speakerDurations) {
+        const percentage =
+            totalDuration > 0 ? (duration / totalDuration) * 100 : 0;
+        statistics.push({ speaker, duration, percentage });
+    }
+
+    statistics.sort((a, b) => b.duration - a.duration);
+
+    return statistics;
+}
+
+export function formatDuration(seconds: number): string {
+    const hours = Math.floor(seconds / 3600);
+    const minutes = Math.floor((seconds % 3600) / 60);
+    const secs = Math.floor(seconds % 60);
+
+    if (hours > 0) {
+        return `${hours}:${minutes.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")}`;
+    }
+
+    return `${minutes}:${secs.toString().padStart(2, "0")}`;
+}
diff --git a/app/utils/time.ts b/app/utils/time.ts
index eedba4d..f84f423 100644
--- a/app/utils/time.ts
+++ b/app/utils/time.ts
@@ -5,7 +5,7 @@ type formatOptions = {
     milliseconds?: boolean;
 };
 
-const defaultOptions: formatOptions = {
+const defaultFormatOptions: formatOptions = {
     milliseconds: true,
 };
 
@@ -14,20 +14,23 @@ const defaultOptions: formatOptions = {
  * @param {number} time - Time in seconds
  * @returns {string} Formatted time string
  */
-export const formatTime = (time: number, options?: formatOptions): string => {
-    const { milliseconds: useMiliseconds } = { ...defaultOptions, ...options };
+export function formatTime(time: number, options?: formatOptions): string {
+    const { milliseconds: useMilliseconds } = {
+        ...defaultFormatOptions,
+        ...options,
+    };
 
     const minutes: number = Math.floor(time / 60);
     const seconds: number = Math.floor(time % 60);
     const milliseconds: number = Math.floor((time % 1) * 1000);
 
     const secondsString = seconds.toString().padStart(2, "0");
-    const millisecondsString = useMiliseconds
+    const millisecondsString = useMilliseconds
         ? milliseconds.toString().padStart(3, "0")
         : "";
 
     return `${minutes}:${secondsString}${millisecondsString ? `.${millisecondsString}` : ""}`;
-};
+}
 
 /**
  * Parses time string in MM: SS format to seconds
@@ -36,7 +39,7 @@ export const formatTime = (time: number, options?: formatOptions): string => {
  *
  * @throws {Error} If time string is invalid
  */
-export const parseTime = (time: string): number => {
+export function parseTime(time: string): number {
     const parts = time.split(":") as [string, string];
 
     if (parts.length !== 2) {
@@ -51,4 +54,4 @@ export const parseTime = (time: string): number => {
     }
 
     return minutes * 60 + seconds;
-};
+}
diff --git a/app/utils/transcriptionSerivce.ts b/app/utils/transcriptionSerivce.ts
new file mode 100644
index 0000000..8579942
--- /dev/null
+++ b/app/utils/transcriptionSerivce.ts
@@ -0,0 +1,78 @@
+import { v4 as uuidv4 } from "uuid";
+import { db } from "~/stores/db";
+import {
+    type StoredTranscription,
+    StoredTranscriptionSchema,
+} from "~/types/storedTranscription";
+
+export const TRANSCRIPTION_RETENTION_PERIOD_MS = 30 * 24 * 60 * 60 * 1000;
+
+export function getTranscriptionService() {
+    function getTranscriptions(): Promise<StoredTranscription[]> {
+        return db.transcriptions.toArray();
+    }
+
+    function getTranscription(
+        id: string,
+    ): Promise<StoredTranscription | undefined> {
+        return db.transcriptions.where("id").equals(id).first();
+    }
+
+    async function addTranscription(
+        transcription: Omit<
+            StoredTranscription,
+            "id" | "createdAt" | "updatedAt"
+        >,
+    ) {
+        const now = new Date();
+
+        const newTranscription = StoredTranscriptionSchema.parse({
+            ...transcription,
+            id: uuidv4(),
+            name:
+                transcription.name ??
+                transcription.mediaFileName ??
+                `Transcription ${now.toLocaleDateString()}`,
+            createdAt: now,
+            updatedAt: now,
+        } as StoredTranscription);
+
+        await db.transcriptions.add(newTranscription);
+
+        return newTranscription;
+    }
+
+    async function updateTranscription(
+        id: string,
+        updates: Partial<StoredTranscription>,
+    ) {
+        const updatesParsed = StoredTranscriptionSchema.partial().parse({
+            ...updates,
+        });
+        await db.transcriptions.update(id, updatesParsed);
+    }
+
+    async function deleteTranscription(id: string) {
+        await db.transcriptions.delete(id);
+    }
+
+    async function cleanupOldTranscriptions(): Promise<number> {
+        const thresholdDate = new Date(
+            Date.now() - TRANSCRIPTION_RETENTION_PERIOD_MS,
+        );
+
+        return await db.transcriptions
+            .where("createdAt")
+            .below(thresholdDate)
+            .delete();
+    }
+
+    return {
+        getTranscriptions,
+        getTranscription,
+        addTranscription,
+        updateTranscription,
+        deleteTranscription,
+        cleanupOldTranscriptions,
+    };
+}
diff --git a/app/utils/videoUtils.ts b/app/utils/videoUtils.ts
new file mode 100644
index 0000000..0a3900f
--- /dev/null
+++ b/app/utils/videoUtils.ts
@@ -0,0 +1,3 @@
+export function isVideoFile(file: File | Blob): boolean {
+    return file.type.startsWith("video/");
+}
diff --git a/biome.json b/biome.json
index 9574703..f3349b6 100644
--- a/biome.json
+++ b/biome.json
@@ -46,6 +46,11 @@
             }
         }
     },
+    "css": {
+        "parser": {
+            "tailwindDirectives": true
+        }
+    },
     "javascript": {
         "formatter": {
             "quoteStyle": "double"
diff --git a/bun.lock b/bun.lock
index 1e7fa03..d1602cf 100644
--- a/bun.lock
+++ b/bun.lock
@@ -1,42 +1,49 @@
 {
   "lockfileVersion": 1,
-  "configVersion": 1,
   "workspaces": {
     "": {
       "name": "transcribo-frontend",
       "dependencies": {
         "@dcc-bs/audio-recorder.bs.js": "^2.0.1",
-        "@dcc-bs/common-ui.bs.js": "^1.1.11",
-        "@dcc-bs/communication.bs.js": "^0.1.1",
-        "@dcc-bs/event-system.bs.js": "git+https://github.com/DCC-BS/event-system.bs.js.git#v1.4.1",
-        "@dcc-bs/feedback-control.bs.js": "git+https://github.com/DCC-BS/feedback-control.bs.js.git#v0.1.6",
-        "@dcc-bs/logger.bs.js": "git+https://github.com/DCC-BS/logger.bs.js.git#v1.4.1",
+        "@dcc-bs/common-ui.bs.js": "^1.2.5",
+        "@dcc-bs/communication.bs.js": "0.1.3",
+        "@dcc-bs/event-system.bs.js": "^1.4.3",
         "@ffmpeg/ffmpeg": "^0.12.15",
         "@ffmpeg/util": "^0.12.2",
-        "@iconify-json/lucide": "^1.2.75",
-        "@nuxt/ui": "^4.2.1",
-        "@nuxtjs/i18n": "^10.2.1",
-        "@nuxtjs/mdc": "^0.20.0",
-        "@pinia/nuxt": "0.11.3",
+        "@iconify-json/lucide": "1.2.95",
+        "@mohtasham/md-to-docx": "^2.8.0",
+        "@nuxt/ui": "4.5.1",
+        "@nuxtjs/i18n": "10.2.3",
+        "@nuxtjs/mdc": "0.20.1",
         "@vite-pwa/nuxt": "1.1.1",
-        "konva": "^10.0.12",
-        "motion-v": "^1.7.4",
+        "@vueuse/core": "^14.2.1",
+        "dexie": "^4.3.0",
+        "driver.js": "^1.4.0",
+        "konva": "10.2.0",
+        "motion-v": "2.0.0",
         "nuxt": "4.3.1",
+        "pino": "10.3.1",
         "ts-pattern": "^5.9.0",
         "uuid": "^13.0.0",
-        "vue": "^3.5.25",
-        "vue-konva": "^3.2.6",
-        "vue-router": "^4.6.3",
-        "vue-tsc": "^3.1.5",
-        "zod": "^4.1.13",
+        "vue": "3.5.29",
+        "vue-konva": "3.3.0",
+        "vue-tsc": "3.2.5",
+        "zod": "4.3.6",
       },
       "devDependencies": {
-        "@biomejs/biome": "2.4.2",
-        "@types/bun": "^1.3.3",
+        "@biomejs/biome": "2.4.5",
+        "@nuxt/test-utils": "^4.0.0",
+        "@types/bun": "1.3.10",
+        "@vitest/coverage-v8": "^4.0.18",
+        "@vue/test-utils": "^2.4.6",
+        "happy-dom": "20.8.3",
         "jiti": "^2.6.1",
+        "msw": "^2.12.10",
+        "pino-pretty": "^13.1.3",
         "sass": "1.97.3",
-        "sass-loader": "^16.0.6",
+        "sass-loader": "16.0.7",
         "typescript": "^5.9.3",
+        "vitest": "^4.0.18",
       },
     },
   },
@@ -233,49 +240,43 @@
 
     "@babel/types": ["@babel/types@7.29.0", "", { "dependencies": { "@babel/helper-string-parser": "^7.27.1", "@babel/helper-validator-identifier": "^7.28.5" } }, "sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A=="],
 
-    "@biomejs/biome": ["@biomejs/biome@2.4.2", "", { "optionalDependencies": { "@biomejs/cli-darwin-arm64": "2.4.2", "@biomejs/cli-darwin-x64": "2.4.2", "@biomejs/cli-linux-arm64": "2.4.2", "@biomejs/cli-linux-arm64-musl": "2.4.2", "@biomejs/cli-linux-x64": "2.4.2", "@biomejs/cli-linux-x64-musl": "2.4.2", "@biomejs/cli-win32-arm64": "2.4.2", "@biomejs/cli-win32-x64": "2.4.2" }, "bin": { "biome": "bin/biome" } }, "sha512-vVE/FqLxNLbvYnFDYg3Xfrh1UdFhmPT5i+yPT9GE2nTUgI4rkqo5krw5wK19YHBd7aE7J6r91RRmb8RWwkjy6w=="],
+    "@bcoe/v8-coverage": ["@bcoe/v8-coverage@1.0.2", "", {}, "sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA=="],
 
-    "@biomejs/cli-darwin-arm64": ["@biomejs/cli-darwin-arm64@2.4.2", "", { "os": "darwin", "cpu": "arm64" }, "sha512-3pEcKCP/1POKyaZZhXcxFl3+d9njmeAihZ17k8lL/1vk+6e0Cbf0yPzKItFiT+5Yh6TQA4uKvnlqe0oVZwRxCA=="],
+    "@biomejs/biome": ["@biomejs/biome@2.4.5", "", { "optionalDependencies": { "@biomejs/cli-darwin-arm64": "2.4.5", "@biomejs/cli-darwin-x64": "2.4.5", "@biomejs/cli-linux-arm64": "2.4.5", "@biomejs/cli-linux-arm64-musl": "2.4.5", "@biomejs/cli-linux-x64": "2.4.5", "@biomejs/cli-linux-x64-musl": "2.4.5", "@biomejs/cli-win32-arm64": "2.4.5", "@biomejs/cli-win32-x64": "2.4.5" }, "bin": { "biome": "bin/biome" } }, "sha512-OWNCyMS0Q011R6YifXNOg6qsOg64IVc7XX6SqGsrGszPbkVCoaO7Sr/lISFnXZ9hjQhDewwZ40789QmrG0GYgQ=="],
 
-    "@biomejs/cli-darwin-x64": ["@biomejs/cli-darwin-x64@2.4.2", "", { "os": "darwin", "cpu": "x64" }, "sha512-P7hK1jLVny+0R9UwyGcECxO6sjETxfPyBm/1dmFjnDOHgdDPjPqozByunrwh4xPKld8sxOr5eAsSqal5uKgeBg=="],
+    "@biomejs/cli-darwin-arm64": ["@biomejs/cli-darwin-arm64@2.4.5", "", { "os": "darwin", "cpu": "arm64" }, "sha512-lGS4Nd5O3KQJ6TeWv10mElnx1phERhBxqGP/IKq0SvZl78kcWDFMaTtVK+w3v3lusRFxJY78n07PbKplirsU5g=="],
 
-    "@biomejs/cli-linux-arm64": ["@biomejs/cli-linux-arm64@2.4.2", "", { "os": "linux", "cpu": "arm64" }, "sha512-DI3Mi7GT2zYNgUTDEbSjl3e1KhoP76OjQdm8JpvZYZWtVDRyLd3w8llSr2TWk1z+U3P44kUBWY3X7H9MD1/DGQ=="],
+    "@biomejs/cli-darwin-x64": ["@biomejs/cli-darwin-x64@2.4.5", "", { "os": "darwin", "cpu": "x64" }, "sha512-6MoH4tyISIBNkZ2Q5T1R7dLd5BsITb2yhhhrU9jHZxnNSNMWl+s2Mxu7NBF8Y3a7JJcqq9nsk8i637z4gqkJxQ=="],
 
-    "@biomejs/cli-linux-arm64-musl": ["@biomejs/cli-linux-arm64-musl@2.4.2", "", { "os": "linux", "cpu": "arm64" }, "sha512-/x04YK9+7erw6tYEcJv9WXoBHcULI/wMOvNdAyE9S3JStZZ9yJyV67sWAI+90UHuDo/BDhq0d96LDqGlSVv7WA=="],
+    "@biomejs/cli-linux-arm64": ["@biomejs/cli-linux-arm64@2.4.5", "", { "os": "linux", "cpu": "arm64" }, "sha512-U1GAG6FTjhAO04MyH4xn23wRNBkT6H7NentHh+8UxD6ShXKBm5SY4RedKJzkUThANxb9rUKIPc7B8ew9Xo/cWg=="],
 
-    "@biomejs/cli-linux-x64": ["@biomejs/cli-linux-x64@2.4.2", "", { "os": "linux", "cpu": "x64" }, "sha512-GK2ErnrKpWFigYP68cXiCHK4RTL4IUWhK92AFS3U28X/nuAL5+hTuy6hyobc8JZRSt+upXt1nXChK+tuHHx4mA=="],
+    "@biomejs/cli-linux-arm64-musl": ["@biomejs/cli-linux-arm64-musl@2.4.5", "", { "os": "linux", "cpu": "arm64" }, "sha512-iqLDgpzobG7gpBF0fwEVS/LT8kmN7+S0E2YKFDtqliJfzNLnAiV2Nnyb+ehCDCJgAZBASkYHR2o60VQWikpqIg=="],
 
-    "@biomejs/cli-linux-x64-musl": ["@biomejs/cli-linux-x64-musl@2.4.2", "", { "os": "linux", "cpu": "x64" }, "sha512-wbBmTkeAoAYbOQ33f6sfKG7pcRSydQiF+dTYOBjJsnXO2mWEOQHllKlC2YVnedqZFERp2WZhFUoO7TNRwnwEHQ=="],
+    "@biomejs/cli-linux-x64": ["@biomejs/cli-linux-x64@2.4.5", "", { "os": "linux", "cpu": "x64" }, "sha512-NdODlSugMzTlENPTa4z0xB82dTUlCpsrOxc43///aNkTLblIYH4XpYflBbf5ySlQuP8AA4AZd1qXhV07IdrHdQ=="],
 
-    "@biomejs/cli-win32-arm64": ["@biomejs/cli-win32-arm64@2.4.2", "", { "os": "win32", "cpu": "arm64" }, "sha512-k2uqwLYrNNxnaoiW3RJxoMGnbKda8FuCmtYG3cOtVljs3CzWxaTR+AoXwKGHscC9thax9R4kOrtWqWN0+KdPTw=="],
+    "@biomejs/cli-linux-x64-musl": ["@biomejs/cli-linux-x64-musl@2.4.5", "", { "os": "linux", "cpu": "x64" }, "sha512-NlKa7GpbQmNhZf9kakQeddqZyT7itN7jjWdakELeXyTU3pg/83fTysRRDPJD0akTfKDl6vZYNT9Zqn4MYZVBOA=="],
 
-    "@biomejs/cli-win32-x64": ["@biomejs/cli-win32-x64@2.4.2", "", { "os": "win32", "cpu": "x64" }, "sha512-9ma7C4g8Sq3cBlRJD2yrsHXB1mnnEBdpy7PhvFrylQWQb4PoyCmPucdX7frvsSBQuFtIiKCrolPl/8tCZrKvgQ=="],
+    "@biomejs/cli-win32-arm64": ["@biomejs/cli-win32-arm64@2.4.5", "", { "os": "win32", "cpu": "arm64" }, "sha512-EBfrTqRIWOFSd7CQb/0ttjHMR88zm3hGravnDwUA9wHAaCAYsULKDebWcN5RmrEo1KBtl/gDVJMrFjNR0pdGUw=="],
+
+    "@biomejs/cli-win32-x64": ["@biomejs/cli-win32-x64@2.4.5", "", { "os": "win32", "cpu": "x64" }, "sha512-Pmhv9zT95YzECfjEHNl3mN9Vhusw9VA5KHY0ZvlGsxsjwS5cb7vpRnHzJIv0vG7jB0JI7xEaMH9ddfZm/RozBw=="],
 
     "@bomb.sh/tab": ["@bomb.sh/tab@0.0.12", "", { "peerDependencies": { "cac": "^6.7.14", "citty": "^0.1.6", "commander": "^13.1.0" }, "optionalPeers": ["cac", "citty", "commander"], "bin": { "tab": "dist/bin/cli.js" } }, "sha512-dYRwg4MqfHR5/BcTy285XOGRhjQFmNpaJBZ0tl2oU+RY595MQ5ApTF6j3OvauPAooHL6cfoOZMySQrOQztT8RQ=="],
 
     "@capsizecss/unpack": ["@capsizecss/unpack@4.0.0", "", { "dependencies": { "fontkitten": "^1.0.0" } }, "sha512-VERIM64vtTP1C4mxQ5thVT9fK0apjPFobqybMtA1UdUujWka24ERHbRHFGmpbbhp73MhV+KSsHQH9C6uOTdEQA=="],
 
-    "@clack/core": ["@clack/core@1.0.1", "", { "dependencies": { "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-WKeyK3NOBwDOzagPR5H08rFk9D/WuN705yEbuZvKqlkmoLM2woKtXb10OO2k1NoSU4SFG947i2/SCYh+2u5e4g=="],
+    "@clack/core": ["@clack/core@1.0.0", "", { "dependencies": { "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-Orf9Ltr5NeiEuVJS8Rk2XTw3IxNC2Bic3ash7GgYeA8LJ/zmSNpSQ/m5UAhe03lA6KFgklzZ5KTHs4OAMA/SAQ=="],
 
-    "@clack/prompts": ["@clack/prompts@1.0.1", "", { "dependencies": { "@clack/core": "1.0.1", "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-/42G73JkuYdyWZ6m8d/CJtBrGl1Hegyc7Fy78m5Ob+jF85TOUmLR5XLce/U3LxYAw0kJ8CT5aI99RIvPHcGp/Q=="],
+    "@clack/prompts": ["@clack/prompts@1.0.0", "", { "dependencies": { "@clack/core": "1.0.0", "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-rWPXg9UaCFqErJVQ+MecOaWsozjaxol4yjnmYcGNipAWzdaWa2x+VJmKfGq7L0APwBohQOYdHC+9RO4qRXej+A=="],
 
     "@cloudflare/kv-asset-handler": ["@cloudflare/kv-asset-handler@0.4.2", "", {}, "sha512-SIOD2DxrRRwQ+jgzlXCqoEFiKOFqaPjhnNTGKXSRLvp1HiOvapLaFG2kEr9dYQTYe8rKrd9uvDUzmAITeNyaHQ=="],
 
-    "@colors/colors": ["@colors/colors@1.6.0", "", {}, "sha512-Ir+AOibqzrIsL6ajt3Rz3LskB7OiMVHqltZmspbW/TJuTVuyOMirVqAkjfY6JISiLHgyNqicAC8AyHHGzNd/dA=="],
-
-    "@dabh/diagnostics": ["@dabh/diagnostics@2.0.8", "", { "dependencies": { "@so-ric/colorspace": "^1.1.6", "enabled": "2.0.x", "kuler": "^2.0.0" } }, "sha512-R4MSXTVnuMzGD7bzHdW2ZhhdPC/igELENcq5IjEverBvq5hn1SXCWcsi6eSsdWP0/Ur+SItRRjAktmdoX/8R/Q=="],
-
     "@dcc-bs/audio-recorder.bs.js": ["@dcc-bs/audio-recorder.bs.js@2.0.1", "", { "dependencies": { "@ffmpeg/ffmpeg": "0.12.15", "@ffmpeg/util": "0.12.2", "@nuxt/kit": "4.2.1", "@nuxtjs/i18n": "10.2.1", "dexie": "4.2.1", "rollup-plugin-import-css": "4.1.2" }, "peerDependencies": { "@nuxt/ui": "4.2.1", "motion-v": "1.7.4" } }, "sha512-bz0DWgrACa0gpKTh4NPMKpBbgbYmHVd+sHQznHeSq04a8QpwuUKROB0HE/QHF61RrE5SVC7heC18FT8iSyUuag=="],
 
-    "@dcc-bs/common-ui.bs.js": ["@dcc-bs/common-ui.bs.js@1.2.1", "", { "dependencies": { "@nuxt/kit": "4.2.2", "@nuxtjs/i18n": "^10.2.1", "gray-matter": "^4.0.3", "markdown-it": "^14.1.0", "semver": "^7.7.3", "tailwind-merge": "^3.4.0", "undici": "^7.16.0" }, "peerDependencies": { "@nuxt/icon": "^2.1.0", "@nuxt/ui": "4.3.0", "motion-v": "^1.7.0", "nuxt": "^4.0.0", "typescript": "^5", "zod": "^4.1.12" } }, "sha512-JibTq6yGObfeF2TlRCFEtKBixhjijs6tI5e/7Md67hme0iySW5UP0f9V4dPK6PpIJ990vx4esamgnpAfNp3Mhw=="],
+    "@dcc-bs/common-ui.bs.js": ["@dcc-bs/common-ui.bs.js@1.2.5", "", { "dependencies": { "@nuxt/kit": "4.3.1", "@nuxtjs/i18n": "10.2.3", "gray-matter": "^4.0.3", "markdown-it": "14.1.1", "semver": "7.7.4", "tailwind-merge": "3.5.0", "typescript": "5.9.3", "undici": "7.22.0" }, "peerDependencies": { "@nuxt/icon": "^2.2.0", "@nuxt/ui": "^4.5.0", "motion-v": "^2.0.0", "nuxt": "^4.3.0", "zod": "^4.3.0" } }, "sha512-cxXQrbf3ktOtLxkI171MKhyPIjpxTN+qD7j9QEro/U9RFchTuWU3eKpcUa/XxbcFrRAlcIM0dwcvOCoaPRMq5w=="],
 
     "@dcc-bs/communication.bs.js": ["@dcc-bs/communication.bs.js@0.1.3", "", { "dependencies": { "vite": "^7.1.6", "vue": "^3.5.25", "zod": "^4.1.9" }, "peerDependencies": { "typescript": "^5" } }, "sha512-6lMlGaGy/zJtl544Y0loB5kgaf9MKC5t4OhKb+wPC1Cg5Y08KmYIyp8kfr/TresuhNtSfPIUEs3phWLJuxGSaQ=="],
 
-    "@dcc-bs/event-system.bs.js": ["@dcc-bs/event-system.bs.js@github:DCC-BS/event-system.bs.js#a7a6def", { "dependencies": { "@nuxt/kit": "^4.0.1" } }, "DCC-BS-event-system.bs.js-a7a6def", "sha512-jQhRPcKxGNlHPeUNJFOrhJl3mSRmKj8kTUsE1DTQCzpq6cBSYo4WnPDcSf6OCOMIQsODngT9FoEk1bdBoBaPDw=="],
-
-    "@dcc-bs/feedback-control.bs.js": ["@dcc-bs/feedback-control.bs.js@github:DCC-BS/feedback-control.bs.js#1d8c216", { "dependencies": { "@nuxt/kit": "^4.0.1", "reka-ui": "^2.4.0", "undici": "^7.12.0" } }, "DCC-BS-feedback-control.bs.js-1d8c216", "sha512-XWGCApTy0bt/FI1BQ3JVB6ZFL+tHCKqfg2HGI0t5YFfIRbvh3IUgaoCr6K4FsWUf84tNa6YC0NNKqQWJ50Pn8g=="],
-
-    "@dcc-bs/logger.bs.js": ["@dcc-bs/logger.bs.js@github:DCC-BS/logger.bs.js#5595a4c", { "dependencies": { "@nuxt/kit": "^4.0.1", "winston": "^3.17.0" } }, "DCC-BS-logger.bs.js-5595a4c", "sha512-yIHB2Ibk+20OE3R4bg7vBxa4gTFhCK/WabCLrJta9mkpm0ORC+swHvNB4x96Uo7A8HuuOzfdH/w/mCLE1EgyTw=="],
+    "@dcc-bs/event-system.bs.js": ["@dcc-bs/event-system.bs.js@1.4.3", "", { "dependencies": { "@nuxt/kit": "^4.0.1" } }, "sha512-G0cRzswB/WGfXehNmoteGVg9MUriRPKaNUO3ugQ2Ss7uUo/KlI9uMW4SJqPOi8ccglbmFMlGCsfsfZ2PbEqhlg=="],
 
     "@dxup/nuxt": ["@dxup/nuxt@0.3.2", "", { "dependencies": { "@dxup/unimport": "^0.1.2", "@nuxt/kit": "^4.2.2", "chokidar": "^5.0.0", "pathe": "^2.0.3", "tinyglobby": "^0.2.15" } }, "sha512-2f2usP4oLNsIGjPprvABe3f3GWuIhIDp0169pGLFxTDRI5A4d4sBbGpR+tD9bGZCT+1Btb6Q2GKlyv3LkDCW5g=="],
 
@@ -385,6 +386,16 @@
 
     "@iconify/vue": ["@iconify/vue@5.0.0", "", { "dependencies": { "@iconify/types": "^2.0.0" }, "peerDependencies": { "vue": ">=3" } }, "sha512-C+KuEWIF5nSBrobFJhT//JS87OZ++QDORB6f2q2Wm6fl2mueSTpFBeBsveK0KW9hWiZ4mNiPjsh6Zs4jjdROSg=="],
 
+    "@inquirer/ansi": ["@inquirer/ansi@1.0.2", "", {}, "sha512-S8qNSZiYzFd0wAcyG5AXCvUHC5Sr7xpZ9wZ2py9XR88jUz8wooStVx5M6dRzczbBWjic9NP7+rY0Xi7qqK/aMQ=="],
+
+    "@inquirer/confirm": ["@inquirer/confirm@5.1.21", "", { "dependencies": { "@inquirer/core": "^10.3.2", "@inquirer/type": "^3.0.10" }, "peerDependencies": { "@types/node": ">=18" }, "optionalPeers": ["@types/node"] }, "sha512-KR8edRkIsUayMXV+o3Gv+q4jlhENF9nMYUZs9PA2HzrXeHI8M5uDag70U7RJn9yyiMZSbtF5/UexBtAVtZGSbQ=="],
+
+    "@inquirer/core": ["@inquirer/core@10.3.2", "", { "dependencies": { "@inquirer/ansi": "^1.0.2", "@inquirer/figures": "^1.0.15", "@inquirer/type": "^3.0.10", "cli-width": "^4.1.0", "mute-stream": "^2.0.0", "signal-exit": "^4.1.0", "wrap-ansi": "^6.2.0", "yoctocolors-cjs": "^2.1.3" }, "peerDependencies": { "@types/node": ">=18" }, "optionalPeers": ["@types/node"] }, "sha512-43RTuEbfP8MbKzedNqBrlhhNKVwoK//vUFNW3Q3vZ88BLcrs4kYpGg+B2mm5p2K/HfygoCxuKwJJiv8PbGmE0A=="],
+
+    "@inquirer/figures": ["@inquirer/figures@1.0.15", "", {}, "sha512-t2IEY+unGHOzAaVM5Xx6DEWKeXlDDcNPeDyUpsRc6CUhBfU3VQOEl+Vssh7VNp1dR8MdUJBWhuObjXCsVpjN5g=="],
+
+    "@inquirer/type": ["@inquirer/type@3.0.10", "", { "peerDependencies": { "@types/node": ">=18" }, "optionalPeers": ["@types/node"] }, "sha512-BvziSRxfz5Ov8ch0z/n3oijRSEcEsHnhggm4xFZe93DHcUCTlutlq9Ox4SVENAfcRD22UQq7T/atg9Wr3k09eA=="],
+
     "@internationalized/date": ["@internationalized/date@3.11.0", "", { "dependencies": { "@swc/helpers": "^0.5.0" } }, "sha512-BOx5huLAWhicM9/ZFs84CzP+V3gBW6vlpM02yzsdYC7TGlZJX1OJiEEHcSayF00Z+3jLlm4w79amvSt6RqKN3Q=="],
 
     "@internationalized/number": ["@internationalized/number@3.6.5", "", { "dependencies": { "@swc/helpers": "^0.5.0" } }, "sha512-6hY4Kl4HPBvtfS62asS/R22JzNNy8vi/Ssev7x6EobfCp+9QIB2hKvI2EtbdJ0VSQacxVNtqhE/NmF/NZ0gm6g=="],
@@ -409,7 +420,7 @@
 
     "@ioredis/commands": ["@ioredis/commands@1.5.1", "", {}, "sha512-JH8ZL/ywcJyR9MmJ5BNqZllXNZQqQbnVZOqpPQqE1vHiFgAw4NHbvE0FOduNU8IX9babitBT46571OnPTT0Zcw=="],
 
-    "@isaacs/cliui": ["@isaacs/cliui@9.0.0", "", {}, "sha512-AokJm4tuBHillT+FpMtxQ60n8ObyXBatq7jD2/JA9dxbDDokKQm8KMht5ibGzLVU9IJDIKK4TPKgMHEYMn3lMg=="],
+    "@isaacs/cliui": ["@isaacs/cliui@8.0.2", "", { "dependencies": { "string-width": "^5.1.2", "string-width-cjs": "npm:string-width@^4.2.0", "strip-ansi": "^7.0.1", "strip-ansi-cjs": "npm:strip-ansi@^6.0.1", "wrap-ansi": "^8.1.0", "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0" } }, "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA=="],
 
     "@isaacs/fs-minipass": ["@isaacs/fs-minipass@4.0.1", "", { "dependencies": { "minipass": "^7.0.4" } }, "sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w=="],
 
@@ -433,6 +444,10 @@
 
     "@miyaneee/rollup-plugin-json5": ["@miyaneee/rollup-plugin-json5@1.2.0", "", { "dependencies": { "@rollup/pluginutils": "^5.1.0", "json5": "^2.2.3" }, "peerDependencies": { "rollup": "^1.20.0 || ^2.0.0 || ^3.0.0 || ^4.0.0" } }, "sha512-JjTIaXZp9WzhUHpElrqPnl1AzBi/rvRs065F71+aTmlqvTMVkdbjZ8vfFl4nRlgJy+TPBw69ZK4pwFdmOAt4aA=="],
 
+    "@mohtasham/md-to-docx": ["@mohtasham/md-to-docx@2.8.0", "", { "dependencies": { "docx": "^9.5.0", "file-saver": "^2.0.5", "mdast-util-find-and-replace": "^3.0.2", "remark": "^15.0.1", "remark-gfm": "^4.0.1", "remark-parse": "^11.0.0", "unified": "^11.0.5", "unist-util-visit": "^5.0.0" }, "bin": { "md-to-docx": "dist/cli.js" } }, "sha512-tQsySz+iGXlUibqCQNgIeJgxClfDSech+tmGoZu2hBSRrBNG0U/C1GEfnUbzilcVzjgzmjYlzvYRe9oL1P+Onw=="],
+
+    "@mswjs/interceptors": ["@mswjs/interceptors@0.41.3", "", { "dependencies": { "@open-draft/deferred-promise": "^2.2.0", "@open-draft/logger": "^0.3.0", "@open-draft/until": "^2.0.0", "is-node-process": "^1.2.0", "outvariant": "^1.4.3", "strict-event-emitter": "^0.5.1" } }, "sha512-cXu86tF4VQVfwz8W1SPbhoRyHJkti6mjH/XJIxp40jhO4j2k1m4KYrEykxqWPkFF3vrK4rgQppBh//AwyGSXPA=="],
+
     "@napi-rs/wasm-runtime": ["@napi-rs/wasm-runtime@1.1.1", "", { "dependencies": { "@emnapi/core": "^1.7.1", "@emnapi/runtime": "^1.7.1", "@tybys/wasm-util": "^0.10.1" } }, "sha512-p64ah1M1ld8xjWv3qbvFwHiFVWrq1yFvV4f7w+mzaqiR4IlSgkqhcRdHwsGgomwzBH51sRY4NEowLxnaBjcW/A=="],
 
     "@nodelib/fs.scandir": ["@nodelib/fs.scandir@2.1.5", "", { "dependencies": { "@nodelib/fs.stat": "2.0.5", "run-parallel": "^1.1.9" } }, "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g=="],
@@ -447,7 +462,7 @@
 
     "@nuxt/devtools": ["@nuxt/devtools@3.2.2", "", { "dependencies": { "@nuxt/devtools-kit": "3.2.2", "@nuxt/devtools-wizard": "3.2.2", "@nuxt/kit": "^4.3.1", "@vue/devtools-core": "^8.0.6", "@vue/devtools-kit": "^8.0.6", "birpc": "^4.0.0", "consola": "^3.4.2", "destr": "^2.0.5", "error-stack-parser-es": "^1.0.5", "execa": "^8.0.1", "fast-npm-meta": "^1.2.1", "get-port-please": "^3.2.0", "hookable": "^6.0.1", "image-meta": "^0.2.2", "is-installed-globally": "^1.0.0", "launch-editor": "^2.13.0", "local-pkg": "^1.1.2", "magicast": "^0.5.2", "nypm": "^0.6.5", "ohash": "^2.0.11", "pathe": "^2.0.3", "perfect-debounce": "^2.1.0", "pkg-types": "^2.3.0", "semver": "^7.7.4", "simple-git": "^3.32.2", "sirv": "^3.0.2", "structured-clone-es": "^1.0.0", "tinyglobby": "^0.2.15", "vite-plugin-inspect": "^11.3.3", "vite-plugin-vue-tracer": "^1.2.0", "which": "^5.0.0", "ws": "^8.19.0" }, "peerDependencies": { "@vitejs/devtools": "*", "vite": ">=6.0" }, "optionalPeers": ["@vitejs/devtools"], "bin": { "devtools": "cli.mjs" } }, "sha512-b6roSuKed5XMg09oWejXb4bRG+iYPDFRHEP2HpAfwpFWgAhpiQIAdrdjZNt4f/pzbfhDqb1R5TSa1KmztOuMKw=="],
 
-    "@nuxt/devtools-kit": ["@nuxt/devtools-kit@3.2.2", "", { "dependencies": { "@nuxt/kit": "^4.3.1", "execa": "^8.0.1" }, "peerDependencies": { "vite": ">=6.0" } }, "sha512-07E1phqoVPNlexlkrYuOMPhTzLIRjcl9iEqyc/vZLH2zWeH/T1X3v+RLTVW5Oio40f/XBp9yQuyihmX34ddjgQ=="],
+    "@nuxt/devtools-kit": ["@nuxt/devtools-kit@2.7.0", "", { "dependencies": { "@nuxt/kit": "^3.19.3", "execa": "^8.0.1" }, "peerDependencies": { "vite": ">=6.0" } }, "sha512-MIJdah6CF6YOW2GhfKnb8Sivu6HpcQheqdjOlZqShBr+1DyjtKQbAKSCAyKPaoIzZP4QOo2SmTFV6aN8jBeEIQ=="],
 
     "@nuxt/devtools-wizard": ["@nuxt/devtools-wizard@3.2.2", "", { "dependencies": { "@clack/prompts": "^1.0.1", "consola": "^3.4.2", "diff": "^8.0.3", "execa": "^8.0.1", "magicast": "^0.5.2", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "semver": "^7.7.4" }, "bin": { "devtools-wizard": "cli.mjs" } }, "sha512-FaKV3xZF+Sj2ORxJNWTUalnEV8cpXW2rkg60KzQd7LryEHgUdFMuY/oTSVh9YmURqSzwVlfYd1Su56yi02pxlA=="],
 
@@ -455,7 +470,7 @@
 
     "@nuxt/icon": ["@nuxt/icon@2.2.1", "", { "dependencies": { "@iconify/collections": "^1.0.641", "@iconify/types": "^2.0.0", "@iconify/utils": "^3.1.0", "@iconify/vue": "^5.0.0", "@nuxt/devtools-kit": "^3.1.1", "@nuxt/kit": "^4.2.2", "consola": "^3.4.2", "local-pkg": "^1.1.2", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "picomatch": "^4.0.3", "std-env": "^3.10.0", "tinyglobby": "^0.2.15" } }, "sha512-GI840yYGuvHI0BGDQ63d6rAxGzG96jQcWrnaWIQKlyQo/7sx9PjXkSHckXUXyX1MCr9zY6U25Td6OatfY6Hklw=="],
 
-    "@nuxt/kit": ["@nuxt/kit@4.2.1", "", { "dependencies": { "c12": "^3.3.1", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.7", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^2.1.2", "scule": "^1.3.0", "semver": "^7.7.3", "tinyglobby": "^0.2.15", "ufo": "^1.6.1", "unctx": "^2.4.1", "untyped": "^2.0.0" } }, "sha512-lLt8KLHyl7IClc3RqRpRikz15eCfTRlAWL9leVzPyg5N87FfKE/7EWgWvpiL/z4Tf3dQCIqQb88TmHE0JTIDvA=="],
+    "@nuxt/kit": ["@nuxt/kit@3.21.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "knitwork": "^1.3.0", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-QORZRjcuTKgo++XP1Pc2c2gqwRydkaExrIRfRI9vFsPA3AzuHVn5Gfmbv1ic8y34e78mr5DMBvJlelUaeOuajg=="],
 
     "@nuxt/nitro-server": ["@nuxt/nitro-server@4.3.1", "", { "dependencies": { "@nuxt/devalue": "^2.0.2", "@nuxt/kit": "4.3.1", "@unhead/vue": "^2.1.3", "@vue/shared": "^3.5.27", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "devalue": "^5.6.2", "errx": "^0.1.0", "escape-string-regexp": "^5.0.0", "exsolve": "^1.0.8", "h3": "^1.15.5", "impound": "^1.0.0", "klona": "^2.0.6", "mocked-exports": "^0.1.1", "nitropack": "^2.13.1", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rou3": "^0.7.12", "std-env": "^3.10.0", "ufo": "^1.6.3", "unctx": "^2.5.0", "unstorage": "^1.17.4", "vue": "^3.5.27", "vue-bundle-renderer": "^2.2.0", "vue-devtools-stub": "^0.1.0" }, "peerDependencies": { "nuxt": "^4.3.1" } }, "sha512-4aNiM69Re02gI1ywnDND0m6QdVKXhWzDdtvl/16veytdHZj3FSq57ZCwOClNJ7HQkEMqXgS+bi6S2HmJX+et+g=="],
 
@@ -463,6 +478,8 @@
 
     "@nuxt/telemetry": ["@nuxt/telemetry@2.7.0", "", { "dependencies": { "citty": "^0.2.0", "consola": "^3.4.2", "ofetch": "^2.0.0-alpha.3", "rc9": "^3.0.0", "std-env": "^3.10.0" }, "peerDependencies": { "@nuxt/kit": ">=3.0.0" }, "bin": { "nuxt-telemetry": "bin/nuxt-telemetry.mjs" } }, "sha512-mrKC3NjAlBOooLLVTYcIUie1meipoYq5vkoESoVTEWTB34T3a0QJzOfOPch+HYlUR+5Lqy1zLMv6epHFgYAKLA=="],
 
+    "@nuxt/test-utils": ["@nuxt/test-utils@4.0.0", "", { "dependencies": { "@clack/prompts": "1.0.0", "@nuxt/devtools-kit": "^2.7.0", "@nuxt/kit": "^3.21.0", "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "estree-walker": "^3.0.3", "exsolve": "^1.0.8", "fake-indexeddb": "^6.2.5", "get-port-please": "^3.2.0", "h3": "^1.15.5", "h3-next": "npm:h3@2.0.1-rc.11", "local-pkg": "^1.1.2", "magic-string": "^0.30.21", "node-fetch-native": "^1.6.7", "node-mock-http": "^1.0.4", "nypm": "^0.6.4", "ofetch": "^1.5.1", "pathe": "^2.0.3", "perfect-debounce": "^2.1.0", "radix3": "^1.1.2", "scule": "^1.3.0", "std-env": "^3.10.0", "tinyexec": "^1.0.2", "ufo": "^1.6.3", "unplugin": "^3.0.0", "vitest-environment-nuxt": "^1.0.1", "vue": "^3.5.27" }, "peerDependencies": { "@cucumber/cucumber": ">=11.0.0", "@jest/globals": ">=30.0.0", "@playwright/test": "^1.43.1", "@testing-library/vue": "^8.0.1", "@vue/test-utils": "^2.4.2", "happy-dom": ">=20.0.11", "jsdom": ">=27.4.0", "playwright-core": "^1.43.1", "vitest": "^4.0.2" }, "optionalPeers": ["@cucumber/cucumber", "@jest/globals", "@playwright/test", "@testing-library/vue", "@vue/test-utils", "happy-dom", "jsdom", "playwright-core", "vitest"] }, "sha512-QJfyCiqYxflUKA5xlEGuXdDApTBhJxoPXxYePIDtA90hkmKbhYs/mrMM+Bi9LiUrI/cCJOPRyIx9jOzhMvTIgg=="],
+
     "@nuxt/ui": ["@nuxt/ui@4.5.1", "", { "dependencies": { "@floating-ui/dom": "^1.7.5", "@iconify/vue": "^5.0.0", "@internationalized/date": "^3.11.0", "@internationalized/number": "^3.6.5", "@nuxt/fonts": "^0.14.0", "@nuxt/icon": "^2.2.1", "@nuxt/kit": "^4.3.1", "@nuxt/schema": "^4.3.1", "@nuxtjs/color-mode": "^3.5.2", "@standard-schema/spec": "^1.1.0", "@tailwindcss/postcss": "^4.2.1", "@tailwindcss/vite": "^4.2.1", "@tanstack/vue-table": "^8.21.3", "@tanstack/vue-virtual": "^3.13.19", "@tiptap/core": "^3.20.0", "@tiptap/extension-bubble-menu": "^3.20.0", "@tiptap/extension-code": "^3.20.0", "@tiptap/extension-collaboration": "^3.20.0", "@tiptap/extension-drag-handle": "^3.20.0", "@tiptap/extension-drag-handle-vue-3": "^3.20.0", "@tiptap/extension-floating-menu": "^3.20.0", "@tiptap/extension-horizontal-rule": "^3.20.0", "@tiptap/extension-image": "^3.20.0", "@tiptap/extension-mention": "^3.20.0", "@tiptap/extension-node-range": "^3.20.0", "@tiptap/extension-placeholder": "^3.20.0", "@tiptap/markdown": "^3.20.0", "@tiptap/pm": "^3.20.0", "@tiptap/starter-kit": "^3.20.0", "@tiptap/suggestion": "^3.20.0", "@tiptap/vue-3": "^3.20.0", "@unhead/vue": "^2.1.10", "@vueuse/core": "^14.2.1", "@vueuse/integrations": "^14.2.1", "@vueuse/shared": "^14.2.1", "colortranslator": "^5.0.0", "consola": "^3.4.2", "defu": "^6.1.4", "embla-carousel-auto-height": "^8.6.0", "embla-carousel-auto-scroll": "^8.6.0", "embla-carousel-autoplay": "^8.6.0", "embla-carousel-class-names": "^8.6.0", "embla-carousel-fade": "^8.6.0", "embla-carousel-vue": "^8.6.0", "embla-carousel-wheel-gestures": "^8.1.0", "fuse.js": "^7.1.0", "hookable": "^5.5.3", "knitwork": "^1.3.0", "magic-string": "^0.30.21", "mlly": "^1.8.0", "motion-v": "^1.10.3", "ohash": "^2.0.11", "pathe": "^2.0.3", "reka-ui": "2.8.2", "scule": "^1.3.0", "tailwind-merge": "^3.5.0", "tailwind-variants": "^3.2.2", "tailwindcss": "^4.2.1", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unplugin": "^3.0.0", "unplugin-auto-import": "^21.0.0", "unplugin-vue-components": "^31.0.0", "vaul-vue": "0.4.1", "vue-component-type-helpers": "^3.2.5" }, "peerDependencies": { "@inertiajs/vue3": "^2.0.7", "@nuxt/content": "^3.0.0", "joi": "^18.0.0", "superstruct": "^2.0.0", "typescript": "^5.9.3", "valibot": "^1.0.0", "vue-router": "^4.5.0", "yup": "^1.7.0", "zod": "^3.24.0 || ^4.0.0" }, "optionalPeers": ["@inertiajs/vue3", "@nuxt/content", "joi", "superstruct", "valibot", "vue-router", "yup", "zod"], "bin": { "nuxt-ui": "cli/index.mjs" } }, "sha512-5hWgreVPX6EsNCZNoOd2o7m9fTA3fwUMDw+zeYTSAjhSKtAuvkZrBtmez4MUeTv+LO1gknesgvErdIvlUnElTg=="],
 
     "@nuxt/vite-builder": ["@nuxt/vite-builder@4.3.1", "", { "dependencies": { "@nuxt/kit": "4.3.1", "@rollup/plugin-replace": "^6.0.3", "@vitejs/plugin-vue": "^6.0.4", "@vitejs/plugin-vue-jsx": "^5.1.4", "autoprefixer": "^10.4.24", "consola": "^3.4.2", "cssnano": "^7.1.2", "defu": "^6.1.4", "esbuild": "^0.27.3", "escape-string-regexp": "^5.0.0", "exsolve": "^1.0.8", "get-port-please": "^3.2.0", "jiti": "^2.6.1", "knitwork": "^1.3.0", "magic-string": "^0.30.21", "mlly": "^1.8.0", "mocked-exports": "^0.1.1", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "postcss": "^8.5.6", "rollup-plugin-visualizer": "^6.0.5", "seroval": "^1.5.0", "std-env": "^3.10.0", "ufo": "^1.6.3", "unenv": "^2.0.0-rc.24", "vite": "^7.3.1", "vite-node": "^5.3.0", "vite-plugin-checker": "^0.12.0", "vue-bundle-renderer": "^2.2.0" }, "peerDependencies": { "nuxt": "4.3.1", "rolldown": "^1.0.0-beta.38", "vue": "^3.3.4" }, "optionalPeers": ["rolldown"] }, "sha512-LndnxPJzDUDbWAB8q5gZZN1mSOLHEyMOoj4T3pTdPydGf31QZdMR0V1fQ1fdRgtgNtWB3WLP0d1ZfaAOITsUpw=="],
@@ -473,6 +490,14 @@
 
     "@nuxtjs/mdc": ["@nuxtjs/mdc@0.20.1", "", { "dependencies": { "@nuxt/kit": "^4.2.2", "@shikijs/core": "^3.21.0", "@shikijs/langs": "^3.21.0", "@shikijs/themes": "^3.21.0", "@shikijs/transformers": "^3.21.0", "@types/hast": "^3.0.4", "@types/mdast": "^4.0.4", "@vue/compiler-core": "^3.5.26", "consola": "^3.4.2", "debug": "^4.4.3", "defu": "^6.1.4", "destr": "^2.0.5", "detab": "^3.0.2", "github-slugger": "^2.0.0", "hast-util-format": "^1.1.0", "hast-util-to-mdast": "^10.1.2", "hast-util-to-string": "^3.0.1", "mdast-util-to-hast": "^13.2.1", "micromark-util-sanitize-uri": "^2.0.1", "parse5": "^8.0.0", "pathe": "^2.0.3", "property-information": "^7.1.0", "rehype-external-links": "^3.0.0", "rehype-minify-whitespace": "^6.0.2", "rehype-raw": "^7.0.0", "rehype-remark": "^10.0.1", "rehype-slug": "^6.0.0", "rehype-sort-attribute-values": "^5.0.1", "rehype-sort-attributes": "^5.0.1", "remark-emoji": "^5.0.2", "remark-gfm": "^4.0.1", "remark-mdc": "^3.10.0", "remark-parse": "^11.0.0", "remark-rehype": "^11.1.2", "remark-stringify": "^11.0.0", "scule": "^1.3.0", "shiki": "^3.21.0", "ufo": "^1.6.3", "unified": "^11.0.5", "unist-builder": "^4.0.0", "unist-util-visit": "^5.0.0", "unwasm": "^0.5.3", "vfile": "^6.0.3" } }, "sha512-fGmtLDQAmmDHF5Z37Apfc3k806rb2XWDOQFhb5xlDSL7+HiiUjyFy3ctx3qWdlC08dRzfAetmsGOYbfDqYsB/w=="],
 
+    "@one-ini/wasm": ["@one-ini/wasm@0.1.1", "", {}, "sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw=="],
+
+    "@open-draft/deferred-promise": ["@open-draft/deferred-promise@2.2.0", "", {}, "sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA=="],
+
+    "@open-draft/logger": ["@open-draft/logger@0.3.0", "", { "dependencies": { "is-node-process": "^1.2.0", "outvariant": "^1.4.0" } }, "sha512-X2g45fzhxH238HKO4xbSr7+wBS8Fvw6ixhTDuvLd5mqh6bJJCFAPwU9mPDxbcrRtfxv4u5IHCEH77BmxvXmmxQ=="],
+
+    "@open-draft/until": ["@open-draft/until@2.1.0", "", {}, "sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg=="],
+
     "@oxc-minify/binding-android-arm-eabi": ["@oxc-minify/binding-android-arm-eabi@0.112.0", "", { "os": "android", "cpu": "arm" }, "sha512-m7TGBR2hjsBJIN9UJ909KBoKsuogo6CuLsHKvUIBXdjI0JVHP8g4ZHeB+BJpGn5LJdeSGDfz9MWiuXrZDRzunw=="],
 
     "@oxc-minify/binding-android-arm64": ["@oxc-minify/binding-android-arm64@0.112.0", "", { "os": "android", "cpu": "arm64" }, "sha512-RvxOOkzvP5NeeoraBtgNJSBqO+XzlS7DooxST/drAXCfO52GsmxVB1N7QmifrsTYtH8GC2z3DTFjZQ1w/AJOWg=="],
@@ -625,7 +650,7 @@
 
     "@parcel/watcher-win32-x64": ["@parcel/watcher-win32-x64@2.5.6", "", { "os": "win32", "cpu": "x64" }, "sha512-hbQlYcCq5dlAX9Qx+kFb0FHue6vbjlf0FrNzSKdYK2APUf7tGfGxQCk2ihEREmbR6ZMc0MVAD5RIX/41gpUzTw=="],
 
-    "@pinia/nuxt": ["@pinia/nuxt@0.11.3", "", { "dependencies": { "@nuxt/kit": "^4.2.0" }, "peerDependencies": { "pinia": "^3.0.4" } }, "sha512-7WVNHpWx4qAEzOlnyrRC88kYrwnlR/PrThWT0XI1dSNyUAXu/KBv9oR37uCgYkZroqP5jn8DfzbkNF3BtKvE9w=="],
+    "@pinojs/redact": ["@pinojs/redact@0.4.0", "", {}, "sha512-k2ENnmBugE/rzQfEcdWHcCY+/FM3VLzH9cYEsbdsoqrvzAKRhUZeRNhAZvB8OitQJ1TBed3yqWtdjzS6wJKBwg=="],
 
     "@pkgjs/parseargs": ["@pkgjs/parseargs@0.11.0", "", {}, "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg=="],
 
@@ -731,8 +756,6 @@
 
     "@sindresorhus/merge-streams": ["@sindresorhus/merge-streams@4.0.0", "", {}, "sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ=="],
 
-    "@so-ric/colorspace": ["@so-ric/colorspace@1.1.6", "", { "dependencies": { "color": "^5.0.2", "text-hex": "1.0.x" } }, "sha512-/KiKkpHNOBgkFJwu9sh48LkHSMYGyuTcSFK/qMBdnOAlrRJzRSXAOFB5qwzaVQuDl8wAvHVMkaASQDReTahxuw=="],
-
     "@speed-highlight/core": ["@speed-highlight/core@1.2.14", "", {}, "sha512-G4ewlBNhUtlLvrJTb88d2mdy2KRijzs4UhnlrOSRT4bmjh/IqNElZa3zkrZ+TC47TwtlDWzVLFADljF1Ijp5hA=="],
 
     "@standard-schema/spec": ["@standard-schema/spec@1.1.0", "", {}, "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w=="],
@@ -859,10 +882,14 @@
 
     "@tybys/wasm-util": ["@tybys/wasm-util@0.10.1", "", { "dependencies": { "tslib": "^2.4.0" } }, "sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg=="],
 
-    "@types/bun": ["@types/bun@1.3.9", "", { "dependencies": { "bun-types": "1.3.9" } }, "sha512-KQ571yULOdWJiMH+RIWIOZ7B2RXQGpL1YQrBtLIV3FqDcCu6FsbFUBwhdKUlCKUpS3PJDsHlJ1QKlpxoVR+xtw=="],
+    "@types/bun": ["@types/bun@1.3.10", "", { "dependencies": { "bun-types": "1.3.10" } }, "sha512-0+rlrUrOrTSskibryHbvQkDOWRJwJZqZlxrUs1u4oOoTln8+WIXBPmAuCF35SWB2z4Zl3E84Nl/D0P7803nigQ=="],
+
+    "@types/chai": ["@types/chai@5.2.3", "", { "dependencies": { "@types/deep-eql": "*", "assertion-error": "^2.0.1" } }, "sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA=="],
 
     "@types/debug": ["@types/debug@4.1.12", "", { "dependencies": { "@types/ms": "*" } }, "sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ=="],
 
+    "@types/deep-eql": ["@types/deep-eql@4.0.2", "", {}, "sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw=="],
+
     "@types/esrecurse": ["@types/esrecurse@4.3.1", "", {}, "sha512-xJBAbDifo5hpffDBuHl0Y8ywswbiAp/Wi7Y/GtAgSlZyIABppyurxVueOPE8LUQOxdlgi6Zqce7uoEpqNTeiUw=="],
 
     "@types/estree": ["@types/estree@1.0.8", "", {}, "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w=="],
@@ -885,7 +912,7 @@
 
     "@types/resolve": ["@types/resolve@1.20.2", "", {}, "sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q=="],
 
-    "@types/triple-beam": ["@types/triple-beam@1.3.5", "", {}, "sha512-6WaYesThRMCl19iryMYP7/x2OVgCtbIVflDGFpWnb9irXI3UjYE4AzmYuiUKY1AJstGijoY+MgUszMgRxIYTYw=="],
+    "@types/statuses": ["@types/statuses@2.0.6", "", {}, "sha512-xMAgYwceFhRA2zY+XbEA7mxYbA093wdiW8Vu6gZPGWy9cmOyU9XesH1tNcEWsKFd5Vzrqx5T3D38PWx1FIIXkA=="],
 
     "@types/trusted-types": ["@types/trusted-types@2.0.7", "", {}, "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw=="],
 
@@ -893,6 +920,10 @@
 
     "@types/web-bluetooth": ["@types/web-bluetooth@0.0.21", "", {}, "sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA=="],
 
+    "@types/whatwg-mimetype": ["@types/whatwg-mimetype@3.0.2", "", {}, "sha512-c2AKvDT8ToxLIOUlN51gTiHXflsfIFisS4pO7pDPoKouJCESkhZnEy623gwP9laCy5lnLDAw1vAzu2vM2YLOrA=="],
+
+    "@types/ws": ["@types/ws@8.18.1", "", { "dependencies": { "@types/node": "*" } }, "sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg=="],
+
     "@typescript-eslint/project-service": ["@typescript-eslint/project-service@8.56.1", "", { "dependencies": { "@typescript-eslint/tsconfig-utils": "^8.56.1", "@typescript-eslint/types": "^8.56.1", "debug": "^4.4.3" }, "peerDependencies": { "typescript": ">=4.8.4 <6.0.0" } }, "sha512-TAdqQTzHNNvlVFfR+hu2PDJrURiwKsUvxFn1M0h95BB8ah5jejas08jUWG4dBA68jDMI988IvtfdAI53JzEHOQ=="],
 
     "@typescript-eslint/scope-manager": ["@typescript-eslint/scope-manager@8.56.1", "", { "dependencies": { "@typescript-eslint/types": "8.56.1", "@typescript-eslint/visitor-keys": "8.56.1" } }, "sha512-YAi4VDKcIZp0O4tz/haYKhmIDZFEUPOreKbfdAN3SzUDMcPhJ8QI99xQXqX+HoUVq8cs85eRKnD+rne2UAnj2w=="],
@@ -917,6 +948,22 @@
 
     "@vitejs/plugin-vue-jsx": ["@vitejs/plugin-vue-jsx@5.1.4", "", { "dependencies": { "@babel/core": "^7.29.0", "@babel/plugin-syntax-typescript": "^7.28.6", "@babel/plugin-transform-typescript": "^7.28.6", "@rolldown/pluginutils": "^1.0.0-rc.2", "@vue/babel-plugin-jsx": "^2.0.1" }, "peerDependencies": { "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0", "vue": "^3.0.0" } }, "sha512-70LmoVk9riR7qc4W2CpjsbNMWTPnuZb9dpFKX1emru0yP57nsc9k8nhLA6U93ngQapv5VDIUq2JatNfLbBIkrA=="],
 
+    "@vitest/coverage-v8": ["@vitest/coverage-v8@4.0.18", "", { "dependencies": { "@bcoe/v8-coverage": "^1.0.2", "@vitest/utils": "4.0.18", "ast-v8-to-istanbul": "^0.3.10", "istanbul-lib-coverage": "^3.2.2", "istanbul-lib-report": "^3.0.1", "istanbul-reports": "^3.2.0", "magicast": "^0.5.1", "obug": "^2.1.1", "std-env": "^3.10.0", "tinyrainbow": "^3.0.3" }, "peerDependencies": { "@vitest/browser": "4.0.18", "vitest": "4.0.18" }, "optionalPeers": ["@vitest/browser"] }, "sha512-7i+N2i0+ME+2JFZhfuz7Tg/FqKtilHjGyGvoHYQ6iLV0zahbsJ9sljC9OcFcPDbhYKCet+sG8SsVqlyGvPflZg=="],
+
+    "@vitest/expect": ["@vitest/expect@4.0.18", "", { "dependencies": { "@standard-schema/spec": "^1.0.0", "@types/chai": "^5.2.2", "@vitest/spy": "4.0.18", "@vitest/utils": "4.0.18", "chai": "^6.2.1", "tinyrainbow": "^3.0.3" } }, "sha512-8sCWUyckXXYvx4opfzVY03EOiYVxyNrHS5QxX3DAIi5dpJAAkyJezHCP77VMX4HKA2LDT/Jpfo8i2r5BE3GnQQ=="],
+
+    "@vitest/mocker": ["@vitest/mocker@4.0.18", "", { "dependencies": { "@vitest/spy": "4.0.18", "estree-walker": "^3.0.3", "magic-string": "^0.30.21" }, "peerDependencies": { "msw": "^2.4.9", "vite": "^6.0.0 || ^7.0.0-0" }, "optionalPeers": ["msw", "vite"] }, "sha512-HhVd0MDnzzsgevnOWCBj5Otnzobjy5wLBe4EdeeFGv8luMsGcYqDuFRMcttKWZA5vVO8RFjexVovXvAM4JoJDQ=="],
+
+    "@vitest/pretty-format": ["@vitest/pretty-format@4.0.18", "", { "dependencies": { "tinyrainbow": "^3.0.3" } }, "sha512-P24GK3GulZWC5tz87ux0m8OADrQIUVDPIjjj65vBXYG17ZeU3qD7r+MNZ1RNv4l8CGU2vtTRqixrOi9fYk/yKw=="],
+
+    "@vitest/runner": ["@vitest/runner@4.0.18", "", { "dependencies": { "@vitest/utils": "4.0.18", "pathe": "^2.0.3" } }, "sha512-rpk9y12PGa22Jg6g5M3UVVnTS7+zycIGk9ZNGN+m6tZHKQb7jrP7/77WfZy13Y/EUDd52NDsLRQhYKtv7XfPQw=="],
+
+    "@vitest/snapshot": ["@vitest/snapshot@4.0.18", "", { "dependencies": { "@vitest/pretty-format": "4.0.18", "magic-string": "^0.30.21", "pathe": "^2.0.3" } }, "sha512-PCiV0rcl7jKQjbgYqjtakly6T1uwv/5BQ9SwBLekVg/EaYeQFPiXcgrC2Y7vDMA8dM1SUEAEV82kgSQIlXNMvA=="],
+
+    "@vitest/spy": ["@vitest/spy@4.0.18", "", {}, "sha512-cbQt3PTSD7P2OARdVW3qWER5EGq7PHlvE+QfzSC0lbwO+xnt7+XH06ZzFjFRgzUX//JmpxrCu92VdwvEPlWSNw=="],
+
+    "@vitest/utils": ["@vitest/utils@4.0.18", "", { "dependencies": { "@vitest/pretty-format": "4.0.18", "tinyrainbow": "^3.0.3" } }, "sha512-msMRKLMVLWygpK3u2Hybgi4MNjcYJvwTb0Ru09+fOyCXIgT5raYP041DRRdiJiI3k/2U6SEbAETB3YtBrUkCFA=="],
+
     "@volar/language-core": ["@volar/language-core@2.4.28", "", { "dependencies": { "@volar/source-map": "2.4.28" } }, "sha512-w4qhIJ8ZSitgLAkVay6AbcnC7gP3glYM3fYwKV3srj8m494E3xtrCv6E+bWviiK/8hs6e6t1ij1s2Endql7vzQ=="],
 
     "@volar/source-map": ["@volar/source-map@2.4.28", "", {}, "sha512-yX2BDBqJkRXfKw8my8VarTyjv48QwxdJtvRgUpNE5erCsgEUdI2DsLbpa+rOQVAJYshY99szEcRDmyHbF10ggQ=="],
@@ -959,6 +1006,8 @@
 
     "@vue/shared": ["@vue/shared@3.5.29", "", {}, "sha512-w7SR0A5zyRByL9XUkCfdLs7t9XOHUyJ67qPGQjOou3p6GvBeBW+AVjUUmlxtZ4PIYaRvE+1LmK44O4uajlZwcg=="],
 
+    "@vue/test-utils": ["@vue/test-utils@2.4.6", "", { "dependencies": { "js-beautify": "^1.14.9", "vue-component-type-helpers": "^2.0.0" } }, "sha512-FMxEjOpYNYiFe0GkaHsnJPXFHxQ6m4t8vI/ElPGpMWxZKpmRvQ33OIrvRXemy6yha03RxhOlQuy+gZMC3CQSow=="],
+
     "@vueuse/core": ["@vueuse/core@14.2.1", "", { "dependencies": { "@types/web-bluetooth": "^0.0.21", "@vueuse/metadata": "14.2.1", "@vueuse/shared": "14.2.1" }, "peerDependencies": { "vue": "^3.5.0" } }, "sha512-3vwDzV+GDUNpdegRY6kzpLm4Igptq+GA0QkJ3W61Iv27YWwW/ufSlOfgQIpN6FZRMG0mkaz4gglJRtq5SeJyIQ=="],
 
     "@vueuse/integrations": ["@vueuse/integrations@14.2.1", "", { "dependencies": { "@vueuse/core": "14.2.1", "@vueuse/shared": "14.2.1" }, "peerDependencies": { "async-validator": "^4", "axios": "^1", "change-case": "^5", "drauu": "^0.4", "focus-trap": "^7 || ^8", "fuse.js": "^7", "idb-keyval": "^6", "jwt-decode": "^4", "nprogress": "^0.2", "qrcode": "^1.5", "sortablejs": "^1", "universal-cookie": "^7 || ^8", "vue": "^3.5.0" }, "optionalPeers": ["async-validator", "axios", "change-case", "drauu", "focus-trap", "fuse.js", "idb-keyval", "jwt-decode", "nprogress", "qrcode", "sortablejs", "universal-cookie"] }, "sha512-2LIUpBi/67PoXJGqSDQUF0pgQWpNHh7beiA+KG2AbybcNm+pTGWT6oPGlBgUoDWmYwfeQqM/uzOHqcILpKL7nA=="],
@@ -967,7 +1016,7 @@
 
     "@vueuse/shared": ["@vueuse/shared@14.2.1", "", { "peerDependencies": { "vue": "^3.5.0" } }, "sha512-shTJncjV9JTI4oVNyF1FQonetYAiTBd+Qj7cY89SWbXSkx7gyhrgtEdF2ZAVWS1S3SHlaROO6F2IesJxQEkZBw=="],
 
-    "abbrev": ["abbrev@3.0.1", "", {}, "sha512-AO2ac6pjRB3SJmGJo+v5/aK6Omggp6fsLrs6wN9bd35ulu4cCwaAU9+7ZhXjeqHVkaHThLuzH0nZr0YpCDhygg=="],
+    "abbrev": ["abbrev@2.0.0", "", {}, "sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ=="],
 
     "abort-controller": ["abort-controller@3.0.0", "", { "dependencies": { "event-target-shim": "^5.0.0" } }, "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg=="],
 
@@ -983,9 +1032,9 @@
 
     "alien-signals": ["alien-signals@3.1.2", "", {}, "sha512-d9dYqZTS90WLiU0I5c6DHj/HcKkF8ZyGN3G5x8wSbslulz70KOxaqCT0hQCo9KOyhVqzqGojvNdJXoTumZOtcw=="],
 
-    "ansi-regex": ["ansi-regex@6.2.2", "", {}, "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg=="],
+    "ansi-regex": ["ansi-regex@5.0.1", "", {}, "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="],
 
-    "ansi-styles": ["ansi-styles@6.2.3", "", {}, "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg=="],
+    "ansi-styles": ["ansi-styles@4.3.0", "", { "dependencies": { "color-convert": "^2.0.1" } }, "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg=="],
 
     "ansis": ["ansis@4.2.0", "", {}, "sha512-HqZ5rWlFjGiV0tDm3UxxgNRqsOTniqoKZu0pIAfh7TZQMGuZK+hH0drySty0si0QXj1ieop4+SkSfPZBPPkHig=="],
 
@@ -1003,8 +1052,12 @@
 
     "arraybuffer.prototype.slice": ["arraybuffer.prototype.slice@1.0.4", "", { "dependencies": { "array-buffer-byte-length": "^1.0.1", "call-bind": "^1.0.8", "define-properties": "^1.2.1", "es-abstract": "^1.23.5", "es-errors": "^1.3.0", "get-intrinsic": "^1.2.6", "is-array-buffer": "^3.0.4" } }, "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ=="],
 
+    "assertion-error": ["assertion-error@2.0.1", "", {}, "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA=="],
+
     "ast-kit": ["ast-kit@2.2.0", "", { "dependencies": { "@babel/parser": "^7.28.5", "pathe": "^2.0.3" } }, "sha512-m1Q/RaVOnTp9JxPX+F+Zn7IcLYMzM8kZofDImfsKZd8MbR+ikdOzTeztStWqfrqIxZnYWryyI9ePm3NGjnZgGw=="],
 
+    "ast-v8-to-istanbul": ["ast-v8-to-istanbul@0.3.12", "", { "dependencies": { "@jridgewell/trace-mapping": "^0.3.31", "estree-walker": "^3.0.3", "js-tokens": "^10.0.0" } }, "sha512-BRRC8VRZY2R4Z4lFIL35MwNXmwVqBityvOIwETtsCSwvjl0IdgFsy9NhdaA6j74nUdtJJlIypeRhpDam19Wq3g=="],
+
     "ast-walker-scope": ["ast-walker-scope@0.8.3", "", { "dependencies": { "@babel/parser": "^7.28.4", "ast-kit": "^2.1.3" } }, "sha512-cbdCP0PGOBq0ASG+sjnKIoYkWMKhhz+F/h9pRexUdX2Hd38+WOlBkRKlqkGOSm0YQpcFMQBJeK4WspUAkwsEdg=="],
 
     "async": ["async@3.2.6", "", {}, "sha512-htCUDlxyyCLMgaM3xXg0C0LW2xqfuQ6p05pCEIsXuyQ+a1koYKTuBMzRNwmybfLgvJDMd0r1LTn4+E0Ti6C2AA=="],
@@ -1015,6 +1068,8 @@
 
     "at-least-node": ["at-least-node@1.0.0", "", {}, "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg=="],
 
+    "atomic-sleep": ["atomic-sleep@1.0.0", "", {}, "sha512-kNOjDqAh7px0XWNI+4QbzoiR/nTkHAWNud2uvnJquD1/x5a7EQZMJT0AczqK0Qn67oY/TTQ1LbUKajZpp3I9tQ=="],
+
     "autoprefixer": ["autoprefixer@10.4.27", "", { "dependencies": { "browserslist": "^4.28.1", "caniuse-lite": "^1.0.30001774", "fraction.js": "^5.3.4", "picocolors": "^1.1.1", "postcss-value-parser": "^4.2.0" }, "peerDependencies": { "postcss": "^8.1.0" }, "bin": { "autoprefixer": "bin/autoprefixer" } }, "sha512-NP9APE+tO+LuJGn7/9+cohklunJsXWiaWEfV3si4Gi/XHDwVNgkwr1J3RQYFIvPy76GmJ9/bW8vyoU1LcxwKHA=="],
 
     "available-typed-arrays": ["available-typed-arrays@1.0.7", "", { "dependencies": { "possible-typed-array-names": "^1.0.0" } }, "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ=="],
@@ -1029,7 +1084,7 @@
 
     "bail": ["bail@2.0.2", "", {}, "sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw=="],
 
-    "balanced-match": ["balanced-match@4.0.4", "", {}, "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA=="],
+    "balanced-match": ["balanced-match@1.0.2", "", {}, "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="],
 
     "bare-events": ["bare-events@2.8.2", "", { "peerDependencies": { "bare-abort-controller": "*" }, "optionalPeers": ["bare-abort-controller"] }, "sha512-riJjyv1/mHLIPX4RwiK+oW9/4c3TEUeORHKefKAKnZ5kyslbN+HXowtbaVEqt4IMUB7OXlfixcs6gsFeo/jhiQ=="],
 
@@ -1053,7 +1108,7 @@
 
     "boolbase": ["boolbase@1.0.0", "", {}, "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww=="],
 
-    "brace-expansion": ["brace-expansion@5.0.4", "", { "dependencies": { "balanced-match": "^4.0.2" } }, "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg=="],
+    "brace-expansion": ["brace-expansion@2.0.2", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ=="],
 
     "braces": ["braces@3.0.3", "", { "dependencies": { "fill-range": "^7.1.1" } }, "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA=="],
 
@@ -1065,7 +1120,7 @@
 
     "buffer-from": ["buffer-from@1.1.2", "", {}, "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="],
 
-    "bun-types": ["bun-types@1.3.9", "", { "dependencies": { "@types/node": "*" } }, "sha512-+UBWWOakIP4Tswh0Bt0QD0alpTY8cb5hvgiYeWCMet9YukHbzuruIEeXC2D7nMJPB12kbh8C7XJykSexEqGKJg=="],
+    "bun-types": ["bun-types@1.3.10", "", { "dependencies": { "@types/node": "*" } }, "sha512-tcpfCCl6XWo6nCVnpcVrxQ+9AYN1iqMIzgrSKYMB/fjLtV2eyAVEg7AxQJuCq/26R6HpKWykQXuSOq/21RYcbg=="],
 
     "bundle-name": ["bundle-name@4.1.0", "", { "dependencies": { "run-applescript": "^7.0.0" } }, "sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q=="],
 
@@ -1085,6 +1140,8 @@
 
     "ccount": ["ccount@2.0.1", "", {}, "sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg=="],
 
+    "chai": ["chai@6.2.2", "", {}, "sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg=="],
+
     "char-regex": ["char-regex@1.0.2", "", {}, "sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw=="],
 
     "character-entities": ["character-entities@2.0.2", "", {}, "sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ=="],
@@ -1101,27 +1158,27 @@
 
     "citty": ["citty@0.2.1", "", {}, "sha512-kEV95lFBhQgtogAPlQfJJ0WGVSokvLr/UEoFPiKKOXF7pl98HfUVUD0ejsuTCld/9xH9vogSywZ5KqHzXrZpqg=="],
 
+    "cli-width": ["cli-width@4.1.0", "", {}, "sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ=="],
+
     "clipboardy": ["clipboardy@4.0.0", "", { "dependencies": { "execa": "^8.0.1", "is-wsl": "^3.1.0", "is64bit": "^2.0.0" } }, "sha512-5mOlNS0mhX0707P2I0aZ2V/cmHUEO/fL7VFLqszkhUsxt7RwnmrInf/eEQKlf5GzvYeHIjT+Ov1HRfNmymlG0w=="],
 
-    "cliui": ["cliui@9.0.1", "", { "dependencies": { "string-width": "^7.2.0", "strip-ansi": "^7.1.0", "wrap-ansi": "^9.0.0" } }, "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w=="],
+    "cliui": ["cliui@8.0.1", "", { "dependencies": { "string-width": "^4.2.0", "strip-ansi": "^6.0.1", "wrap-ansi": "^7.0.0" } }, "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ=="],
 
     "cluster-key-slot": ["cluster-key-slot@1.1.2", "", {}, "sha512-RMr0FhtfXemyinomL4hrWcYJxmX6deFdCxpJzhDttxgO1+bcCnkk+9drydLVDmAMG7NE6aN/fl4F7ucU/90gAA=="],
 
-    "color": ["color@5.0.3", "", { "dependencies": { "color-convert": "^3.1.3", "color-string": "^2.1.3" } }, "sha512-ezmVcLR3xAVp8kYOm4GS45ZLLgIE6SPAFoduLr6hTDajwb3KZ2F46gulK3XpcwRFb5KKGCSezCBAY4Dw4HsyXA=="],
-
-    "color-convert": ["color-convert@3.1.3", "", { "dependencies": { "color-name": "^2.0.0" } }, "sha512-fasDH2ont2GqF5HpyO4w0+BcewlhHEZOFn9c1ckZdHpJ56Qb7MHhH/IcJZbBGgvdtwdwNbLvxiBEdg336iA9Sg=="],
-
-    "color-name": ["color-name@2.1.0", "", {}, "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg=="],
+    "color-convert": ["color-convert@2.0.1", "", { "dependencies": { "color-name": "~1.1.4" } }, "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ=="],
 
-    "color-string": ["color-string@2.1.4", "", { "dependencies": { "color-name": "^2.0.0" } }, "sha512-Bb6Cq8oq0IjDOe8wJmi4JeNn763Xs9cfrBcaylK1tPypWzyoy2G3l90v9k64kjphl/ZJjPIShFztenRomi8WTg=="],
+    "color-name": ["color-name@1.1.4", "", {}, "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="],
 
     "colord": ["colord@2.9.3", "", {}, "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw=="],
 
+    "colorette": ["colorette@2.0.20", "", {}, "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w=="],
+
     "colortranslator": ["colortranslator@5.0.0", "", {}, "sha512-Z3UPUKasUVDFCDYAjP2fmlVRf1jFHJv1izAmPjiOa0OCIw1W7iC8PZ2GsoDa8uZv+mKyWopxxStT9q05+27h7w=="],
 
     "comma-separated-tokens": ["comma-separated-tokens@2.0.3", "", {}, "sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg=="],
 
-    "commander": ["commander@2.20.3", "", {}, "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="],
+    "commander": ["commander@10.0.1", "", {}, "sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug=="],
 
     "common-tags": ["common-tags@1.8.2", "", {}, "sha512-gk/Z852D2Wtb//0I+kRFNKKE9dIIVirjoqPoA1wJU+XePVXZfGeBpk45+A1rKO4Q43prqWBNY/MiIeRLbPWUaA=="],
 
@@ -1133,13 +1190,15 @@
 
     "confbox": ["confbox@0.2.4", "", {}, "sha512-ysOGlgTFbN2/Y6Cg3Iye8YKulHw+R2fNXHrgSmXISQdMnomY6eNDprVdW9R5xBguEqI954+S6709UyiO7B+6OQ=="],
 
+    "config-chain": ["config-chain@1.1.13", "", { "dependencies": { "ini": "^1.3.4", "proto-list": "~1.2.1" } }, "sha512-qj+f8APARXHrM0hraqXYb2/bOVSV4PvJQlNZ/DVj0QrmNM2q2euizkeuVckQ57J+W0mRH6Hvi+k50M4Jul2VRQ=="],
+
     "consola": ["consola@3.4.2", "", {}, "sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA=="],
 
     "convert-source-map": ["convert-source-map@2.0.0", "", {}, "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg=="],
 
-    "cookie-es": ["cookie-es@2.0.0", "", {}, "sha512-RAj4E421UYRgqokKUmotqAwuplYw15qtdXfY+hGzgCJ/MBjCVZcSoHK/kH9kocfjRjcDME7IiDWR/1WX1TM2Pg=="],
+    "cookie": ["cookie@1.1.1", "", {}, "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ=="],
 
-    "copy-anything": ["copy-anything@4.0.5", "", { "dependencies": { "is-what": "^5.2.0" } }, "sha512-7Vv6asjS4gMOuILabD3l739tsaxFQmC+a7pLZm02zyvs8p977bL3zEgq3yDk5rn9B0PbYgIv++jmHcuUab4RhA=="],
+    "cookie-es": ["cookie-es@2.0.0", "", {}, "sha512-RAj4E421UYRgqokKUmotqAwuplYw15qtdXfY+hGzgCJ/MBjCVZcSoHK/kH9kocfjRjcDME7IiDWR/1WX1TM2Pg=="],
 
     "copy-paste": ["copy-paste@2.2.0", "", { "dependencies": { "iconv-lite": "^0.4.8" } }, "sha512-jqSL4r9DSeiIvJZStLzY/sMLt9ToTM7RsK237lYOTG+KcbQJHGala3R1TUpa8h1p9adswVgIdV4qGbseVhL4lg=="],
 
@@ -1187,6 +1246,8 @@
 
     "data-view-byte-offset": ["data-view-byte-offset@1.0.1", "", { "dependencies": { "call-bound": "^1.0.2", "es-errors": "^1.3.0", "is-data-view": "^1.0.1" } }, "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ=="],
 
+    "dateformat": ["dateformat@4.6.3", "", {}, "sha512-2P0p0pFGzHS5EMnhdxQi7aJN+iMheud0UhG4dlE1DLAlvL8JHjJJTX/CSm4JXwV0Ka5nGk3zC5mcb5bUQUxxMA=="],
+
     "db0": ["db0@0.3.4", "", { "peerDependencies": { "@electric-sql/pglite": "*", "@libsql/client": "*", "better-sqlite3": "*", "drizzle-orm": "*", "mysql2": "*", "sqlite3": "*" }, "optionalPeers": ["@electric-sql/pglite", "@libsql/client", "better-sqlite3", "drizzle-orm", "mysql2", "sqlite3"] }, "sha512-RiXXi4WaNzPTHEOu8UPQKMooIbqOEyqA1t7Z6MsdxSCeb8iUC9ko3LcmsLmeUt2SM5bctfArZKkRQggKZz7JNw=="],
 
     "debug": ["debug@4.4.3", "", { "dependencies": { "ms": "^2.1.3" } }, "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA=="],
@@ -1225,10 +1286,12 @@
 
     "devlop": ["devlop@1.1.0", "", { "dependencies": { "dequal": "^2.0.0" } }, "sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA=="],
 
-    "dexie": ["dexie@4.2.1", "", {}, "sha512-Ckej0NS6jxQ4Po3OrSQBFddayRhTCic2DoCAG5zacOfOVB9P2Q5Xc5uL/nVa7ZVs+HdMnvUPzLFCB/JwpB6Csg=="],
+    "dexie": ["dexie@4.3.0", "", {}, "sha512-5EeoQpJvMKHe6zWt/FSIIuRa3CWlZeIl6zKXt+Lz7BU6RoRRLgX9dZEynRfXrkLcldKYCBiz7xekTEylnie1Ug=="],
 
     "diff": ["diff@8.0.3", "", {}, "sha512-qejHi7bcSD4hQAZE0tNAawRK1ZtafHDmMTMkrrIGgSLl7hTnQHmKCeB45xAcbfTqK2zowkM3j3bHt/4b/ARbYQ=="],
 
+    "docx": ["docx@9.6.0", "", { "dependencies": { "@types/node": "^25.2.3", "hash.js": "^1.1.7", "jszip": "^3.10.1", "nanoid": "^5.1.3", "xml": "^1.0.1", "xml-js": "^1.6.8" } }, "sha512-y6EaJJMDvt4P7wgGQB9KsZf4wsRkQMJfkc9LlNufRshggI5BT35hGNkXBCAeEoI3MLMwApKguxzjdqqVcBCqNA=="],
+
     "dom-serializer": ["dom-serializer@2.0.0", "", { "dependencies": { "domelementtype": "^2.3.0", "domhandler": "^5.0.2", "entities": "^4.2.0" } }, "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg=="],
 
     "domelementtype": ["domelementtype@2.3.0", "", {}, "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw=="],
@@ -1241,12 +1304,16 @@
 
     "dotenv": ["dotenv@17.3.1", "", {}, "sha512-IO8C/dzEb6O3F9/twg6ZLXz164a2fhTnEWb95H23Dm4OuN+92NmEAlTrupP9VW6Jm3sO26tQlqyvyi4CsnY9GA=="],
 
+    "driver.js": ["driver.js@1.4.0", "", {}, "sha512-Gm64jm6PmcU+si21sQhBrTAM1JvUrR0QhNmjkprNLxohOBzul9+pNHXgQaT9lW84gwg9GMLB3NZGuGolsz5uew=="],
+
     "dunder-proto": ["dunder-proto@1.0.1", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.1", "es-errors": "^1.3.0", "gopd": "^1.2.0" } }, "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A=="],
 
     "duplexer": ["duplexer@0.1.2", "", {}, "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg=="],
 
     "eastasianwidth": ["eastasianwidth@0.2.0", "", {}, "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA=="],
 
+    "editorconfig": ["editorconfig@1.0.7", "", { "dependencies": { "@one-ini/wasm": "0.1.1", "commander": "^10.0.0", "minimatch": "^9.0.1", "semver": "^7.5.3" }, "bin": { "editorconfig": "bin/editorconfig" } }, "sha512-e0GOtq/aTQhVdNyDU9e02+wz9oDDM+SIOQxWME2QRjzRX5yyLAuHDE+0aE8vHb9XRC8XD37eO2u57+F09JqFhw=="],
+
     "ee-first": ["ee-first@1.1.1", "", {}, "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="],
 
     "ejs": ["ejs@3.1.10", "", { "dependencies": { "jake": "^10.8.5" }, "bin": { "ejs": "bin/cli.js" } }, "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA=="],
@@ -1271,19 +1338,19 @@
 
     "embla-carousel-wheel-gestures": ["embla-carousel-wheel-gestures@8.1.0", "", { "dependencies": { "wheel-gestures": "^2.2.5" }, "peerDependencies": { "embla-carousel": "^8.0.0 || ~8.0.0-rc03" } }, "sha512-J68jkYrxbWDmXOm2n2YHl+uMEXzkGSKjWmjaEgL9xVvPb3HqVmg6rJSKfI3sqIDVvm7mkeTy87wtG/5263XqHQ=="],
 
-    "emoji-regex": ["emoji-regex@10.6.0", "", {}, "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A=="],
+    "emoji-regex": ["emoji-regex@8.0.0", "", {}, "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="],
 
     "emojilib": ["emojilib@2.4.0", "", {}, "sha512-5U0rVMU5Y2n2+ykNLQqMoqklN9ICBT/KsvC1Gz6vqHbz2AXXGkG+Pm5rMWk/8Vjrr/mY9985Hi8DYzn1F09Nyw=="],
 
     "emoticon": ["emoticon@4.1.0", "", {}, "sha512-VWZfnxqwNcc51hIy/sbOdEem6D+cVtpPzEEtVAFdaas30+1dgkyaOQ4sQ6Bp0tOMqWO1v+HQfYaoodOkdhK6SQ=="],
 
-    "enabled": ["enabled@2.0.0", "", {}, "sha512-AKrN98kuwOzMIdAizXGI86UFBoo26CL21UM763y1h/GMSJ4/OHU9k2YlsmBpyScFo/wbLzWQJBMCW4+IO3/+OQ=="],
-
     "encodeurl": ["encodeurl@2.0.0", "", {}, "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg=="],
 
+    "end-of-stream": ["end-of-stream@1.4.5", "", { "dependencies": { "once": "^1.4.0" } }, "sha512-ooEGc6HP26xXq/N+GCGOT0JKCLDGrq2bQUZrQ7gyrJiZANJ/8YDTxTpQBXGMn+WbIQXNVpyWymm7KYVICQnyOg=="],
+
     "enhanced-resolve": ["enhanced-resolve@5.20.0", "", { "dependencies": { "graceful-fs": "^4.2.4", "tapable": "^2.3.0" } }, "sha512-/ce7+jQ1PQ6rVXwe+jKEg5hW5ciicHwIQUagZkp6IufBoY3YDgdTTY1azVs0qoRgVmvsNB+rbjLJxDAeHHtwsQ=="],
 
-    "entities": ["entities@4.5.0", "", {}, "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw=="],
+    "entities": ["entities@7.0.1", "", {}, "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA=="],
 
     "error-stack-parser-es": ["error-stack-parser-es@1.0.5", "", {}, "sha512-5qucVt2XcuGMcEGgWI7i+yZpmpByQ8J1lHhcL7PwqCwu9FPP3VUXzT4ltHe5i2z9dePwEHcDVOAfSnHsOlCXRA=="],
 
@@ -1295,7 +1362,7 @@
 
     "es-errors": ["es-errors@1.3.0", "", {}, "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw=="],
 
-    "es-module-lexer": ["es-module-lexer@2.0.0", "", {}, "sha512-5POEcUuZybH7IdmGsD8wlf0AI55wMecM9rVBTI/qEAy2c1kTOm3DjFYjrBdI2K3BaJjJYfYFeRtM0t9ssnRuxw=="],
+    "es-module-lexer": ["es-module-lexer@1.7.0", "", {}, "sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA=="],
 
     "es-object-atoms": ["es-object-atoms@1.1.1", "", { "dependencies": { "es-errors": "^1.3.0" } }, "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA=="],
 
@@ -1329,7 +1396,7 @@
 
     "estraverse": ["estraverse@5.3.0", "", {}, "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA=="],
 
-    "estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+    "estree-walker": ["estree-walker@3.0.3", "", { "dependencies": { "@types/estree": "^1.0.0" } }, "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g=="],
 
     "esutils": ["esutils@2.0.3", "", {}, "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g=="],
 
@@ -1343,12 +1410,18 @@
 
     "execa": ["execa@8.0.1", "", { "dependencies": { "cross-spawn": "^7.0.3", "get-stream": "^8.0.1", "human-signals": "^5.0.0", "is-stream": "^3.0.0", "merge-stream": "^2.0.0", "npm-run-path": "^5.1.0", "onetime": "^6.0.0", "signal-exit": "^4.1.0", "strip-final-newline": "^3.0.0" } }, "sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg=="],
 
+    "expect-type": ["expect-type@1.3.0", "", {}, "sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA=="],
+
     "exsolve": ["exsolve@1.0.8", "", {}, "sha512-LmDxfWXwcTArk8fUEnOfSZpHOJ6zOMUJKOtFLFqJLoKJetuQG874Uc7/Kki7zFLzYybmZhp1M7+98pfMqeX8yA=="],
 
     "extend": ["extend@3.0.2", "", {}, "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="],
 
     "extend-shallow": ["extend-shallow@2.0.1", "", { "dependencies": { "is-extendable": "^0.1.0" } }, "sha512-zCnTtlxNoAiDc3gqY2aYAWFx7XWWiasuF2K8Me5WbN8otHKTUKBwjPtNpRs/rbUZm7KxWAaNj7P1a/p52GbVug=="],
 
+    "fake-indexeddb": ["fake-indexeddb@6.2.5", "", {}, "sha512-CGnyrvbhPlWYMngksqrSSUT1BAVP49dZocrHuK0SvtR0D5TMs5wP0o3j7jexDJW01KSadjBp1M/71o/KR3nD1w=="],
+
+    "fast-copy": ["fast-copy@4.0.2", "", {}, "sha512-ybA6PDXIXOXivLJK/z9e+Otk7ve13I4ckBvGO5I2RRmBU1gMHLVDJYEuJYhGwez7YNlYji2M2DvVU+a9mSFDlw=="],
+
     "fast-deep-equal": ["fast-deep-equal@3.1.3", "", {}, "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="],
 
     "fast-fifo": ["fast-fifo@1.3.2", "", {}, "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ=="],
@@ -1361,16 +1434,18 @@
 
     "fast-npm-meta": ["fast-npm-meta@1.3.0", "", { "bin": { "fast-npm-meta": "dist/cli.mjs" } }, "sha512-Yz48hvMPiD+J5vPQj767Gdd3i6TOzqwBuvc0ylkzyxh2+VEJmtWBBy1OT1/CoeStcKhS6lBK8opUf13BNXBBYw=="],
 
+    "fast-safe-stringify": ["fast-safe-stringify@2.1.1", "", {}, "sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA=="],
+
     "fast-uri": ["fast-uri@3.1.0", "", {}, "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA=="],
 
     "fastq": ["fastq@1.20.1", "", { "dependencies": { "reusify": "^1.0.4" } }, "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw=="],
 
     "fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="],
 
-    "fecha": ["fecha@4.2.3", "", {}, "sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw=="],
-
     "file-entry-cache": ["file-entry-cache@8.0.0", "", { "dependencies": { "flat-cache": "^4.0.0" } }, "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ=="],
 
+    "file-saver": ["file-saver@2.0.5", "", {}, "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="],
+
     "file-uri-to-path": ["file-uri-to-path@1.0.0", "", {}, "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw=="],
 
     "filelist": ["filelist@1.0.6", "", { "dependencies": { "minimatch": "^5.0.1" } }, "sha512-5giy2PkLYY1cP39p17Ech+2xlpTRL9HLspOfEgm0L6CwBXBTgsK5ou0JtzYuepxkaQ/tvhCFIJ5uXo0OrM2DxA=="],
@@ -1385,8 +1460,6 @@
 
     "flatted": ["flatted@3.3.4", "", {}, "sha512-3+mMldrTAPdta5kjX2G2J7iX4zxtnwpdA8Tr2ZSjkyPSanvbZAcy6flmtnXbEybHrDcU9641lxrMfFuUxVz9vA=="],
 
-    "fn.name": ["fn.name@1.1.0", "", {}, "sha512-GRnmB5gPyJpAhTQdSZTSp9uaPSvl09KoYcMQtsB9rQoOmzs9dH6ffeccH+Z+cv6P68Hu5bC6JjRh4Ah/mHSNRw=="],
-
     "fontaine": ["fontaine@0.8.0", "", { "dependencies": { "@capsizecss/unpack": "^4.0.0", "css-tree": "^3.1.0", "magic-regexp": "^0.10.0", "magic-string": "^0.30.21", "pathe": "^2.0.3", "ufo": "^1.6.1", "unplugin": "^2.3.10" } }, "sha512-eek1GbzOdWIj9FyQH/emqW1aEdfC3lYRCHepzwlFCm5T77fBSRSyNRKE6/antF1/B1M+SfJXVRQTY9GAr7lnDg=="],
 
     "fontkitten": ["fontkitten@1.0.2", "", { "dependencies": { "tiny-inflate": "^1.0.3" } }, "sha512-piJxbLnkD9Xcyi7dWJRnqszEURixe7CrF/efBfbffe2DPyabmuIuqraruY8cXTs19QoM8VJzx47BDRVNXETM7Q=="],
@@ -1437,11 +1510,11 @@
 
     "get-symbol-description": ["get-symbol-description@1.1.0", "", { "dependencies": { "call-bound": "^1.0.3", "es-errors": "^1.3.0", "get-intrinsic": "^1.2.6" } }, "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg=="],
 
-    "giget": ["giget@3.1.2", "", { "bin": { "giget": "dist/cli.mjs" } }, "sha512-T2qUpKBHeUTwHcIhydgnJzhL0Hj785ms+JkxaaWQH9SDM/llXeewnOkfJcFShAHjWI+26hOChwUfCoupaXLm8g=="],
+    "giget": ["giget@2.0.0", "", { "dependencies": { "citty": "^0.1.6", "consola": "^3.4.0", "defu": "^6.1.4", "node-fetch-native": "^1.6.6", "nypm": "^0.6.0", "pathe": "^2.0.3" }, "bin": { "giget": "dist/cli.mjs" } }, "sha512-L5bGsVkxJbJgdnwyuheIunkGatUF/zssUoxxjACCseZYAVbaqdh9Tsmmlkl8vYan09H7sbvKt4pS8GqKLBrEzA=="],
 
     "github-slugger": ["github-slugger@2.0.0", "", {}, "sha512-IaOQ9puYtjrkq7Y0Ygl9KDZnrf/aiUJYUpVf89y8kyaxbRG7Y1SrX/jaumrv81vc61+kiMempujsM3Yw7w5qcw=="],
 
-    "glob": ["glob@11.1.0", "", { "dependencies": { "foreground-child": "^3.3.1", "jackspeak": "^4.1.1", "minimatch": "^10.1.1", "minipass": "^7.1.2", "package-json-from-dist": "^1.0.0", "path-scurry": "^2.0.0" }, "bin": { "glob": "dist/esm/bin.mjs" } }, "sha512-vuNwKSaKiqm7g0THUBu2x7ckSs3XJLXE+2ssL7/MfTGPLLcrJQ/4Uq1CjPTtO5cCIiRxqvN6Twy1qOwhL0Xjcw=="],
+    "glob": ["glob@10.5.0", "", { "dependencies": { "foreground-child": "^3.1.0", "jackspeak": "^3.1.2", "minimatch": "^9.0.4", "minipass": "^7.1.2", "package-json-from-dist": "^1.0.0", "path-scurry": "^1.11.1" }, "bin": { "glob": "dist/esm/bin.mjs" } }, "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg=="],
 
     "glob-parent": ["glob-parent@5.1.2", "", { "dependencies": { "is-glob": "^4.0.1" } }, "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow=="],
 
@@ -1455,14 +1528,22 @@
 
     "graceful-fs": ["graceful-fs@4.2.11", "", {}, "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ=="],
 
+    "graphql": ["graphql@16.13.0", "", {}, "sha512-uSisMYERbaB9bkA9M4/4dnqyktaEkf1kMHNKq/7DHyxVeWqHQ2mBmVqm5u6/FVHwF3iCNalKcg82Zfl+tffWoA=="],
+
     "gray-matter": ["gray-matter@4.0.3", "", { "dependencies": { "js-yaml": "^3.13.1", "kind-of": "^6.0.2", "section-matter": "^1.0.0", "strip-bom-string": "^1.0.0" } }, "sha512-5v6yZd4JK3eMI3FqqCouswVqwugaA9r4dNZB1wwcmrD02QkV5H0y7XBQW8QwQqEaZY1pM9aqORSORhJRdNK44Q=="],
 
     "gzip-size": ["gzip-size@7.0.0", "", { "dependencies": { "duplexer": "^0.1.2" } }, "sha512-O1Ld7Dr+nqPnmGpdhzLmMTQ4vAsD+rHwMm1NLUmoUFFymBOMKxCCrtDxqdBRYXdeEPEi3SyoR4TizJLQrnKBNA=="],
 
     "h3": ["h3@1.15.5", "", { "dependencies": { "cookie-es": "^1.2.2", "crossws": "^0.3.5", "defu": "^6.1.4", "destr": "^2.0.5", "iron-webcrypto": "^1.2.1", "node-mock-http": "^1.0.4", "radix3": "^1.1.2", "ufo": "^1.6.3", "uncrypto": "^0.1.3" } }, "sha512-xEyq3rSl+dhGX2Lm0+eFQIAzlDN6Fs0EcC4f7BNUmzaRX/PTzeuM+Tr2lHB8FoXggsQIeXLj8EDVgs5ywxyxmg=="],
 
+    "h3-next": ["h3@2.0.1-rc.11", "", { "dependencies": { "rou3": "^0.7.12", "srvx": "^0.10.1" }, "peerDependencies": { "crossws": "^0.4.1" }, "optionalPeers": ["crossws"] }, "sha512-2myzjCqy32c1As9TjZW9fNZXtLqNedjFSrdFy2AjFBQQ3LzrnGoDdFDYfC0tV2e4vcyfJ2Sfo/F6NQhO2Ly/Mw=="],
+
+    "happy-dom": ["happy-dom@20.8.3", "", { "dependencies": { "@types/node": ">=20.0.0", "@types/whatwg-mimetype": "^3.0.2", "@types/ws": "^8.18.1", "entities": "^7.0.1", "whatwg-mimetype": "^3.0.0", "ws": "^8.18.3" } }, "sha512-lMHQRRwIPyJ70HV0kkFT7jH/gXzSI7yDkQFe07E2flwmNDFoWUTRMKpW2sglsnpeA7b6S2TJPp98EbQxai8eaQ=="],
+
     "has-bigints": ["has-bigints@1.1.0", "", {}, "sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg=="],
 
+    "has-flag": ["has-flag@4.0.0", "", {}, "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="],
+
     "has-property-descriptors": ["has-property-descriptors@1.0.2", "", { "dependencies": { "es-define-property": "^1.0.0" } }, "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg=="],
 
     "has-proto": ["has-proto@1.2.0", "", { "dependencies": { "dunder-proto": "^1.0.0" } }, "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ=="],
@@ -1471,6 +1552,8 @@
 
     "has-tostringtag": ["has-tostringtag@1.0.2", "", { "dependencies": { "has-symbols": "^1.0.3" } }, "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw=="],
 
+    "hash.js": ["hash.js@1.1.7", "", { "dependencies": { "inherits": "^2.0.3", "minimalistic-assert": "^1.0.1" } }, "sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA=="],
+
     "hasown": ["hasown@2.0.2", "", { "dependencies": { "function-bind": "^1.1.2" } }, "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ=="],
 
     "hast-util-embedded": ["hast-util-embedded@3.0.0", "", { "dependencies": { "@types/hast": "^3.0.0", "hast-util-is-element": "^3.0.0" } }, "sha512-naH8sld4Pe2ep03qqULEtvYr7EjrLK2QHY8KJR6RJkTUjPGObe1vnx585uzem2hGra+s1q08DZZpfgDVYRbaXA=="],
@@ -1509,10 +1592,16 @@
 
     "hastscript": ["hastscript@9.0.1", "", { "dependencies": { "@types/hast": "^3.0.0", "comma-separated-tokens": "^2.0.0", "hast-util-parse-selector": "^4.0.0", "property-information": "^7.0.0", "space-separated-tokens": "^2.0.0" } }, "sha512-g7df9rMFX/SPi34tyGCyUBREQoKkapwdY/T04Qn9TDWfHhAYt4/I0gMVirzK5wEzeUqIjEB+LXC/ypb7Aqno5w=="],
 
+    "headers-polyfill": ["headers-polyfill@4.0.3", "", {}, "sha512-IScLbePpkvO846sIwOtOTDjutRMWdXdJmXdMvk6gCBHxFO8d+QKOQedyZSxFTTFYRSmlgSTDtXqqq4pcenBXLQ=="],
+
+    "help-me": ["help-me@5.0.0", "", {}, "sha512-7xgomUX6ADmcYzFik0HzAxh/73YlKR9bmFzf51CZwR+b6YtzU2m0u49hQCqV6SvlqIqsaxovfwdvbnsw3b/zpg=="],
+
     "hey-listen": ["hey-listen@1.0.8", "", {}, "sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q=="],
 
     "hookable": ["hookable@5.5.3", "", {}, "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ=="],
 
+    "html-escaper": ["html-escaper@2.0.2", "", {}, "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg=="],
+
     "html-void-elements": ["html-void-elements@3.0.0", "", {}, "sha512-bEqo66MRXsUGxWHV5IP0PUiAWwoEjba4VCzg0LjFJBpchPaTfyfCKTG6bc5F8ucKec3q5y6qOdGyYTSBEvhCrg=="],
 
     "html-whitespace-sensitive-tag-names": ["html-whitespace-sensitive-tag-names@3.0.1", "", {}, "sha512-q+310vW8zmymYHALr1da4HyXUQ0zgiIwIicEfotYPWGN0OJVEN/58IJ3A4GBYcEq3LGAZqKb+ugvP0GNB9CEAA=="],
@@ -1537,6 +1626,8 @@
 
     "image-meta": ["image-meta@0.2.2", "", {}, "sha512-3MOLanc3sb3LNGWQl1RlQlNWURE5g32aUphrDyFeCsxBTk08iE3VNe4CwsUZ0Qs1X+EfX0+r29Sxdpza4B+yRA=="],
 
+    "immediate": ["immediate@3.0.6", "", {}, "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ=="],
+
     "immutable": ["immutable@5.1.4", "", {}, "sha512-p6u1bG3YSnINT5RQmx/yRZBpenIl30kVxkTLDyHLIMk0gict704Q9n+thfDI7lTRm9vXdDYutVzXhzcThxTnXA=="],
 
     "impound": ["impound@1.0.0", "", { "dependencies": { "exsolve": "^1.0.5", "mocked-exports": "^0.1.1", "pathe": "^2.0.3", "unplugin": "^2.3.2", "unplugin-utils": "^0.2.4" } }, "sha512-8lAJ+1Arw2sMaZ9HE2ZmL5zOcMnt18s6+7Xqgq2aUVy4P1nlzAyPtzCDxsk51KVFwHEEdc6OWvUyqwHwhRYaug=="],
@@ -1545,7 +1636,7 @@
 
     "inherits": ["inherits@2.0.4", "", {}, "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="],
 
-    "ini": ["ini@4.1.1", "", {}, "sha512-QQnnxNyfvmHFIsj7gkPcYymR8Jdw/o7mp5ZFihxn6h8Ci6fh3Dx4E1gPjpQEpIuPo9XVNY/ZUwh4BPMjGyL01g=="],
+    "ini": ["ini@1.3.8", "", {}, "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew=="],
 
     "internal-slot": ["internal-slot@1.1.0", "", { "dependencies": { "es-errors": "^1.3.0", "hasown": "^2.0.2", "side-channel": "^1.1.0" } }, "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw=="],
 
@@ -1603,6 +1694,8 @@
 
     "is-negative-zero": ["is-negative-zero@2.0.3", "", {}, "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw=="],
 
+    "is-node-process": ["is-node-process@1.2.0", "", {}, "sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw=="],
+
     "is-number": ["is-number@7.0.0", "", {}, "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng=="],
 
     "is-number-object": ["is-number-object@1.1.1", "", { "dependencies": { "call-bound": "^1.0.3", "has-tostringtag": "^1.0.2" } }, "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw=="],
@@ -1623,7 +1716,7 @@
 
     "is-shared-array-buffer": ["is-shared-array-buffer@1.0.4", "", { "dependencies": { "call-bound": "^1.0.3" } }, "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A=="],
 
-    "is-stream": ["is-stream@2.0.1", "", {}, "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg=="],
+    "is-stream": ["is-stream@3.0.0", "", {}, "sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA=="],
 
     "is-string": ["is-string@1.1.1", "", { "dependencies": { "call-bound": "^1.0.3", "has-tostringtag": "^1.0.2" } }, "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA=="],
 
@@ -1637,25 +1730,35 @@
 
     "is-weakset": ["is-weakset@2.0.4", "", { "dependencies": { "call-bound": "^1.0.3", "get-intrinsic": "^1.2.6" } }, "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ=="],
 
-    "is-what": ["is-what@5.5.0", "", {}, "sha512-oG7cgbmg5kLYae2N5IVd3jm2s+vldjxJzK1pcu9LfpGuQ93MQSzo0okvRna+7y5ifrD+20FE8FvjusyGaz14fw=="],
-
     "is-wsl": ["is-wsl@3.1.1", "", { "dependencies": { "is-inside-container": "^1.0.0" } }, "sha512-e6rvdUCiQCAuumZslxRJWR/Doq4VpPR82kqclvcS0efgt430SlGIk05vdCN58+VrzgtIcfNODjozVielycD4Sw=="],
 
     "is64bit": ["is64bit@2.0.0", "", { "dependencies": { "system-architecture": "^0.1.0" } }, "sha512-jv+8jaWCl0g2lSBkNSVXdzfBA0npK1HGC2KtWM9FumFRoGS94g3NbCCLVnCYHLjp4GrW2KZeeSTMo5ddtznmGw=="],
 
-    "isarray": ["isarray@2.0.5", "", {}, "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="],
+    "isarray": ["isarray@1.0.0", "", {}, "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ=="],
 
     "isexe": ["isexe@3.1.5", "", {}, "sha512-6B3tLtFqtQS4ekarvLVMZ+X+VlvQekbe4taUkf/rhVO3d/h0M2rfARm/pXLcPEsjjMsFgrFgSrhQIxcSVrBz8w=="],
 
     "isomorphic.js": ["isomorphic.js@0.2.5", "", {}, "sha512-PIeMbHqMt4DnUP3MA/Flc0HElYjMXArsw1qwJZcm9sqR8mq3l8NYizFMty0pWwE/tzIGH3EKK5+jes5mAr85yw=="],
 
-    "jackspeak": ["jackspeak@4.2.3", "", { "dependencies": { "@isaacs/cliui": "^9.0.0" } }, "sha512-ykkVRwrYvFm1nb2AJfKKYPr0emF6IiXDYUaFx4Zn9ZuIH7MrzEZ3sD5RlqGXNRpHtvUHJyOnCEFxOlNDtGo7wg=="],
+    "istanbul-lib-coverage": ["istanbul-lib-coverage@3.2.2", "", {}, "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg=="],
+
+    "istanbul-lib-report": ["istanbul-lib-report@3.0.1", "", { "dependencies": { "istanbul-lib-coverage": "^3.0.0", "make-dir": "^4.0.0", "supports-color": "^7.1.0" } }, "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw=="],
+
+    "istanbul-reports": ["istanbul-reports@3.2.0", "", { "dependencies": { "html-escaper": "^2.0.0", "istanbul-lib-report": "^3.0.0" } }, "sha512-HGYWWS/ehqTV3xN10i23tkPkpH46MLCIMFNCaaKNavAXTF1RkqxawEPtnjnGZ6XKSInBKkiOA5BKS+aZiY3AvA=="],
+
+    "jackspeak": ["jackspeak@3.4.3", "", { "dependencies": { "@isaacs/cliui": "^8.0.2" }, "optionalDependencies": { "@pkgjs/parseargs": "^0.11.0" } }, "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw=="],
 
     "jake": ["jake@10.9.4", "", { "dependencies": { "async": "^3.2.6", "filelist": "^1.0.4", "picocolors": "^1.1.1" }, "bin": { "jake": "bin/cli.js" } }, "sha512-wpHYzhxiVQL+IV05BLE2Xn34zW1S223hvjtqk0+gsPrwd/8JNLXJgZZM/iPFsYc1xyphF+6M6EvdE5E9MBGkDA=="],
 
     "jiti": ["jiti@2.6.1", "", { "bin": { "jiti": "lib/jiti-cli.mjs" } }, "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ=="],
 
-    "js-tokens": ["js-tokens@9.0.1", "", {}, "sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ=="],
+    "joycon": ["joycon@3.1.1", "", {}, "sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw=="],
+
+    "js-beautify": ["js-beautify@1.15.4", "", { "dependencies": { "config-chain": "^1.1.13", "editorconfig": "^1.0.4", "glob": "^10.4.2", "js-cookie": "^3.0.5", "nopt": "^7.2.1" }, "bin": { "css-beautify": "js/bin/css-beautify.js", "html-beautify": "js/bin/html-beautify.js", "js-beautify": "js/bin/js-beautify.js" } }, "sha512-9/KXeZUKKJwqCXUdBxFJ3vPh467OCckSBmYDwSK/EtV090K+iMJ7zx2S3HLVDIWFQdqMIsZWbnaGiba18aWhaA=="],
+
+    "js-cookie": ["js-cookie@3.0.5", "", {}, "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw=="],
+
+    "js-tokens": ["js-tokens@10.0.0", "", {}, "sha512-lM/UBzQmfJRo9ABXbPWemivdCW8V2G8FHaHdypQaIy523snUjog0W71ayWXTjiR+ixeMyVHN2XcpnTd/liPg/Q=="],
 
     "js-yaml": ["js-yaml@3.14.2", "", { "dependencies": { "argparse": "^1.0.7", "esprima": "^4.0.0" }, "bin": { "js-yaml": "bin/js-yaml.js" } }, "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg=="],
 
@@ -1677,6 +1780,8 @@
 
     "jsonpointer": ["jsonpointer@5.0.1", "", {}, "sha512-p/nXbhSEcu3pZRdkW1OfJhpsVtW1gd4Wa1fnQc9YLiTfAjn0312eMKimbdIQzuZl9aa9xUGaRlP9T/CJE/ditQ=="],
 
+    "jszip": ["jszip@3.10.1", "", { "dependencies": { "lie": "~3.3.0", "pako": "~1.0.2", "readable-stream": "~2.3.6", "setimmediate": "^1.0.5" } }, "sha512-xXDvecyTpGLrqFrvkrUSoxxfJI5AH7U8zxxtVclpsUtMCq4JQ290LY8AW5c7Ggnr/Y/oK+bQMbqK2qmtk3pN4g=="],
+
     "keyv": ["keyv@4.5.4", "", { "dependencies": { "json-buffer": "3.0.1" } }, "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw=="],
 
     "kind-of": ["kind-of@6.0.3", "", {}, "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw=="],
@@ -1689,8 +1794,6 @@
 
     "konva": ["konva@10.2.0", "", {}, "sha512-JBoz0Xjbf49UPxCZegZ4WseqOzJ+C4AUDOtJ9eBve5RS5Fcq/u8TdBD5fDl/uPFInpC3a9uycm0sRyZpF4hheg=="],
 
-    "kuler": ["kuler@2.0.0", "", {}, "sha512-Xq9nH7KlWZmXAtodXDDRE7vs6DU1gTU8zYDHDiWLSip45Egwq3plLHzPn27NgvzL2r1LMPC1vdqh98sQxtqj4A=="],
-
     "launch-editor": ["launch-editor@2.13.1", "", { "dependencies": { "picocolors": "^1.1.1", "shell-quote": "^1.8.3" } }, "sha512-lPSddlAAluRKJ7/cjRFoXUFzaX7q/YKI7yPHuEvSJVqoXvFnJov1/Ud87Aa4zULIbA9Nja4mSPK8l0z/7eV2wA=="],
 
     "lazystream": ["lazystream@1.0.1", "", { "dependencies": { "readable-stream": "^2.0.5" } }, "sha512-b94GiNHQNy6JNTrt5w6zNyffMrNkXZb3KTkCZJb2V1xaEGCk093vkZ2jk3tpaeP33/OiXC+WvK9AxUebnf5nbw=="],
@@ -1701,6 +1804,8 @@
 
     "lib0": ["lib0@0.2.117", "", { "dependencies": { "isomorphic.js": "^0.2.4" }, "bin": { "0serve": "bin/0serve.js", "0gentesthtml": "bin/gentesthtml.js", "0ecdsa-generate-keypair": "bin/0ecdsa-generate-keypair.js" } }, "sha512-DeXj9X5xDCjgKLU/7RR+/HQEVzuuEUiwldwOGsHK/sfAfELGWEyTcf0x+uOvCvK3O2zPmZePXWL85vtia6GyZw=="],
 
+    "lie": ["lie@3.3.0", "", { "dependencies": { "immediate": "~3.0.5" } }, "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ=="],
+
     "lightningcss": ["lightningcss@1.31.1", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.31.1", "lightningcss-darwin-arm64": "1.31.1", "lightningcss-darwin-x64": "1.31.1", "lightningcss-freebsd-x64": "1.31.1", "lightningcss-linux-arm-gnueabihf": "1.31.1", "lightningcss-linux-arm64-gnu": "1.31.1", "lightningcss-linux-arm64-musl": "1.31.1", "lightningcss-linux-x64-gnu": "1.31.1", "lightningcss-linux-x64-musl": "1.31.1", "lightningcss-win32-arm64-msvc": "1.31.1", "lightningcss-win32-x64-msvc": "1.31.1" } }, "sha512-l51N2r93WmGUye3WuFoN5k10zyvrVs0qfKBhyC5ogUQ6Ew6JUSswh78mbSO+IU3nTWsyOArqPCcShdQSadghBQ=="],
 
     "lightningcss-android-arm64": ["lightningcss-android-arm64@1.31.1", "", { "os": "android", "cpu": "arm64" }, "sha512-HXJF3x8w9nQ4jbXRiNppBCqeZPIAfUo8zE/kOEGbW5NZvGc/K7nMxbhIr+YlFlHW5mpbg/YFPdbnCh1wAXCKFg=="],
@@ -1751,8 +1856,6 @@
 
     "lodash.uniq": ["lodash.uniq@4.5.0", "", {}, "sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ=="],
 
-    "logform": ["logform@2.7.0", "", { "dependencies": { "@colors/colors": "1.6.0", "@types/triple-beam": "^1.3.2", "fecha": "^4.2.0", "ms": "^2.1.1", "safe-stable-stringify": "^2.3.1", "triple-beam": "^1.3.0" } }, "sha512-TFYA4jnP7PVbmlBIfhlSe+WKxs9dklXMTEGcBCIvLhE/Tn3H6Gk1norupVW7m5Cnd4bLcr08AytbyV/xj7f/kQ=="],
-
     "longest-streak": ["longest-streak@3.1.0", "", {}, "sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g=="],
 
     "lru-cache": ["lru-cache@11.2.6", "", {}, "sha512-ESL2CrkS/2wTPfuend7Zhkzo2u0daGJ/A2VucJOgQ/C48S/zB8MMeMHSGKYpXhIjbPxfuezITkaBH1wqv00DDQ=="],
@@ -1765,6 +1868,8 @@
 
     "magicast": ["magicast@0.5.2", "", { "dependencies": { "@babel/parser": "^7.29.0", "@babel/types": "^7.29.0", "source-map-js": "^1.2.1" } }, "sha512-E3ZJh4J3S9KfwdjZhe2afj6R9lGIN5Pher1pF39UGrXRqq/VDaGVIGN13BjHd2u8B61hArAGOnso7nBOouW3TQ=="],
 
+    "make-dir": ["make-dir@4.0.0", "", { "dependencies": { "semver": "^7.5.3" } }, "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw=="],
+
     "markdown-it": ["markdown-it@14.1.1", "", { "dependencies": { "argparse": "^2.0.1", "entities": "^4.4.0", "linkify-it": "^5.0.0", "mdurl": "^2.0.0", "punycode.js": "^2.3.1", "uc.micro": "^2.1.0" }, "bin": { "markdown-it": "bin/markdown-it.mjs" } }, "sha512-BuU2qnTti9YKgK5N+IeMubp14ZUKUUw7yeJbkjtosvHiP0AZ5c8IAgEMk79D0eC8F23r4Ac/q8cAIFdm2FtyoA=="],
 
     "markdown-table": ["markdown-table@3.0.4", "", {}, "sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw=="],
@@ -1871,14 +1976,16 @@
 
     "mimic-fn": ["mimic-fn@4.0.0", "", {}, "sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw=="],
 
-    "minimatch": ["minimatch@10.2.4", "", { "dependencies": { "brace-expansion": "^5.0.2" } }, "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg=="],
+    "minimalistic-assert": ["minimalistic-assert@1.0.1", "", {}, "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A=="],
+
+    "minimatch": ["minimatch@9.0.9", "", { "dependencies": { "brace-expansion": "^2.0.2" } }, "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg=="],
+
+    "minimist": ["minimist@1.2.8", "", {}, "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA=="],
 
     "minipass": ["minipass@7.1.3", "", {}, "sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A=="],
 
     "minizlib": ["minizlib@3.1.0", "", { "dependencies": { "minipass": "^7.1.2" } }, "sha512-KZxYo1BUkWD2TVFLr0MQoM8vUUigWD3LlD83a/75BqC+4qE0Hb1Vo5v1FgcfaNXvfXzr+5EhQ6ing/CaBijTlw=="],
 
-    "mitt": ["mitt@3.0.1", "", {}, "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="],
-
     "mlly": ["mlly@1.8.0", "", { "dependencies": { "acorn": "^8.15.0", "pathe": "^2.0.3", "pkg-types": "^1.3.1", "ufo": "^1.6.1" } }, "sha512-l8D9ODSRWLe2KHJSifWGwBqpTZXIXTeo8mlKjY+E2HAakaTeNpqAyBZ8GSqLzHgw4XmHmC8whvpjJNMbFZN7/g=="],
 
     "mocked-exports": ["mocked-exports@0.1.1", "", {}, "sha512-aF7yRQr/Q0O2/4pIXm6PZ5G+jAd7QS4Yu8m+WEeEHGnbo+7mE36CbLSDQiXYV8bVL3NfmdeqPJct0tUlnjVSnA=="],
@@ -1887,15 +1994,19 @@
 
     "motion-utils": ["motion-utils@12.29.2", "", {}, "sha512-G3kc34H2cX2gI63RqU+cZq+zWRRPSsNIOjpdl9TN4AQwC4sgwYPl/Q/Obf/d53nOm569T0fYK+tcoSV50BWx8A=="],
 
-    "motion-v": ["motion-v@1.10.3", "", { "dependencies": { "framer-motion": "^12.25.0", "hey-listen": "^1.0.8", "motion-dom": "^12.23.23" }, "peerDependencies": { "@vueuse/core": ">=10.0.0", "vue": ">=3.0.0" } }, "sha512-9Ewo/wwGv7FO3PqYJpllBF/Efc7tbeM1iinVrM73s0RUQrnXHwMZCaRX98u4lu0PQCrZghPPfCsQ14pWKIEbnQ=="],
+    "motion-v": ["motion-v@2.0.0", "", { "dependencies": { "framer-motion": "^12.29.2", "hey-listen": "^1.0.8", "motion-dom": "^12.29.2", "motion-utils": "^12.29.2" }, "peerDependencies": { "@vueuse/core": ">=10.0.0", "vue": ">=3.0.0" } }, "sha512-oQuQMrPhti+Zps6OosOaW3b/eqzaGAuwI54XHJKq/dIWtQWcNzfyhTo4VB5xmp7yLN+3BE9FKF6skLsynfgbHQ=="],
 
     "mrmime": ["mrmime@2.0.1", "", {}, "sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ=="],
 
     "ms": ["ms@2.1.3", "", {}, "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="],
 
+    "msw": ["msw@2.12.10", "", { "dependencies": { "@inquirer/confirm": "^5.0.0", "@mswjs/interceptors": "^0.41.2", "@open-draft/deferred-promise": "^2.2.0", "@types/statuses": "^2.0.6", "cookie": "^1.0.2", "graphql": "^16.12.0", "headers-polyfill": "^4.0.2", "is-node-process": "^1.2.0", "outvariant": "^1.4.3", "path-to-regexp": "^6.3.0", "picocolors": "^1.1.1", "rettime": "^0.10.1", "statuses": "^2.0.2", "strict-event-emitter": "^0.5.1", "tough-cookie": "^6.0.0", "type-fest": "^5.2.0", "until-async": "^3.0.2", "yargs": "^17.7.2" }, "peerDependencies": { "typescript": ">= 4.8.x" }, "optionalPeers": ["typescript"], "bin": { "msw": "cli/index.js" } }, "sha512-G3VUymSE0/iegFnuipujpwyTM2GuZAKXNeerUSrG2+Eg391wW63xFs5ixWsK9MWzr1AGoSkYGmyAzNgbR3+urw=="],
+
     "muggle-string": ["muggle-string@0.4.1", "", {}, "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ=="],
 
-    "nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="],
+    "mute-stream": ["mute-stream@2.0.0", "", {}, "sha512-WWdIxpyjEn+FhQJQQv9aQAYlHoNVdzIzUySNV1gHUPDSdZJ3yZn7pAAbQcV7B56Mvu881q9FZV+0Vx2xC44VWA=="],
+
+    "nanoid": ["nanoid@5.1.6", "", { "bin": { "nanoid": "bin/nanoid.js" } }, "sha512-c7+7RQ+dMB5dPwwCp4ee1/iV/q2P6aK1mTZcfr1BTuVlyW9hJYiMPybJCcnBlQtuSmTIWNeazm/zqNoZSSElBg=="],
 
     "nanotar": ["nanotar@0.2.1", "", {}, "sha512-MUrzzDUcIOPbv7ubhDV/L4CIfVTATd9XhDE2ixFeCrM5yp9AlzUpn91JrnN0HD6hksdxvz9IW9aKANz0Bta0GA=="],
 
@@ -1921,7 +2032,7 @@
 
     "node-releases": ["node-releases@2.0.27", "", {}, "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA=="],
 
-    "nopt": ["nopt@8.1.0", "", { "dependencies": { "abbrev": "^3.0.0" }, "bin": { "nopt": "bin/nopt.js" } }, "sha512-ieGu42u/Qsa4TFktmaKEwM6MQH0pOWnaB3htzh0JRtx84+Mebc0cbZYN5bC+6WTZ4+77xrL9Pn5m7CV6VIkV7A=="],
+    "nopt": ["nopt@7.2.1", "", { "dependencies": { "abbrev": "^2.0.0" }, "bin": { "nopt": "bin/nopt.js" } }, "sha512-taM24ViiimT/XntxbPyJQzCG+p4EKOpgD3mxFwW38mGjVUrfERQOeY4EDHjdnptttfHuHQXFx+lTP08Q+mLa/w=="],
 
     "normalize-path": ["normalize-path@3.0.0", "", {}, "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="],
 
@@ -1949,9 +2060,11 @@
 
     "on-change": ["on-change@6.0.2", "", {}, "sha512-08+12qcOVEA0fS9g/VxKS27HaT94nRutUT77J2dr8zv/unzXopvhBuF8tNLWsoLQ5IgrQ6eptGeGqUYat82U1w=="],
 
+    "on-exit-leak-free": ["on-exit-leak-free@2.1.2", "", {}, "sha512-0eJJY6hXLGf1udHwfNftBqH+g73EU4B504nZeKpz1sYRKafAghwxEJunB2O7rDZkL4PGfsMVnTXZ2EjibbqcsA=="],
+
     "on-finished": ["on-finished@2.4.1", "", { "dependencies": { "ee-first": "1.1.1" } }, "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg=="],
 
-    "one-time": ["one-time@1.0.0", "", { "dependencies": { "fn.name": "1.x.x" } }, "sha512-5DXOiRKwuSEcQ/l0kGCF6Q3jcADFv5tSmRaJck/OqkVFcOzutB134KRSfF0xDrL39MNnqxbHBbUUcjZIhTgb2g=="],
+    "once": ["once@1.4.0", "", { "dependencies": { "wrappy": "1" } }, "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w=="],
 
     "onetime": ["onetime@6.0.0", "", { "dependencies": { "mimic-fn": "^4.0.0" } }, "sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ=="],
 
@@ -1965,6 +2078,8 @@
 
     "orderedmap": ["orderedmap@2.1.1", "", {}, "sha512-TvAWxi0nDe1j/rtMcWcIj94+Ffe6n7zhow33h40SKxmsmozs6dz/e+EajymfoFcHd7sxNn8yHM8839uixMOV6g=="],
 
+    "outvariant": ["outvariant@1.4.3", "", {}, "sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA=="],
+
     "own-keys": ["own-keys@1.0.1", "", { "dependencies": { "get-intrinsic": "^1.2.6", "object-keys": "^1.1.1", "safe-push-apply": "^1.0.0" } }, "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg=="],
 
     "oxc-minify": ["oxc-minify@0.112.0", "", { "optionalDependencies": { "@oxc-minify/binding-android-arm-eabi": "0.112.0", "@oxc-minify/binding-android-arm64": "0.112.0", "@oxc-minify/binding-darwin-arm64": "0.112.0", "@oxc-minify/binding-darwin-x64": "0.112.0", "@oxc-minify/binding-freebsd-x64": "0.112.0", "@oxc-minify/binding-linux-arm-gnueabihf": "0.112.0", "@oxc-minify/binding-linux-arm-musleabihf": "0.112.0", "@oxc-minify/binding-linux-arm64-gnu": "0.112.0", "@oxc-minify/binding-linux-arm64-musl": "0.112.0", "@oxc-minify/binding-linux-ppc64-gnu": "0.112.0", "@oxc-minify/binding-linux-riscv64-gnu": "0.112.0", "@oxc-minify/binding-linux-riscv64-musl": "0.112.0", "@oxc-minify/binding-linux-s390x-gnu": "0.112.0", "@oxc-minify/binding-linux-x64-gnu": "0.112.0", "@oxc-minify/binding-linux-x64-musl": "0.112.0", "@oxc-minify/binding-openharmony-arm64": "0.112.0", "@oxc-minify/binding-wasm32-wasi": "0.112.0", "@oxc-minify/binding-win32-arm64-msvc": "0.112.0", "@oxc-minify/binding-win32-ia32-msvc": "0.112.0", "@oxc-minify/binding-win32-x64-msvc": "0.112.0" } }, "sha512-rkVSeeIRSt+RYI9uX6xonBpLUpvZyegxIg0UL87ev7YAfUqp7IIZlRjkgQN5Us1lyXD//TOo0Dcuuro/TYOWoQ=="],
@@ -1983,6 +2098,8 @@
 
     "package-manager-detector": ["package-manager-detector@1.6.0", "", {}, "sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA=="],
 
+    "pako": ["pako@1.0.11", "", {}, "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw=="],
+
     "parse-entities": ["parse-entities@4.0.2", "", { "dependencies": { "@types/unist": "^2.0.0", "character-entities-legacy": "^3.0.0", "character-reference-invalid": "^2.0.0", "decode-named-character-reference": "^1.0.0", "is-alphanumerical": "^2.0.0", "is-decimal": "^2.0.0", "is-hexadecimal": "^2.0.0" } }, "sha512-GG2AQYWoLgL877gQIKeRPGO1xF9+eG1ujIb5soS5gPvLQ1y2o8FL90w2QWNdf9I361Mpp7726c+lj3U0qK1uGw=="],
 
     "parse5": ["parse5@8.0.0", "", { "dependencies": { "entities": "^6.0.0" } }, "sha512-9m4m5GSgXjL4AjumKzq1Fgfp3Z8rsvjRNbnkVwfu2ImRqE5D0LnY2QfDen18FSY9C573YU5XxSapdHZTZ2WolA=="],
@@ -1997,7 +2114,9 @@
 
     "path-parse": ["path-parse@1.0.7", "", {}, "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="],
 
-    "path-scurry": ["path-scurry@2.0.2", "", { "dependencies": { "lru-cache": "^11.0.0", "minipass": "^7.1.2" } }, "sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg=="],
+    "path-scurry": ["path-scurry@1.11.1", "", { "dependencies": { "lru-cache": "^10.2.0", "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0" } }, "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA=="],
+
+    "path-to-regexp": ["path-to-regexp@6.3.0", "", {}, "sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ=="],
 
     "pathe": ["pathe@2.0.3", "", {}, "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w=="],
 
@@ -2007,7 +2126,13 @@
 
     "picomatch": ["picomatch@4.0.3", "", {}, "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q=="],
 
-    "pinia": ["pinia@3.0.4", "", { "dependencies": { "@vue/devtools-api": "^7.7.7" }, "peerDependencies": { "typescript": ">=4.5.0", "vue": "^3.5.11" }, "optionalPeers": ["typescript"] }, "sha512-l7pqLUFTI/+ESXn6k3nu30ZIzW5E2WZF/LaHJEpoq6ElcLD+wduZoB2kBN19du6K/4FDpPMazY2wJr+IndBtQw=="],
+    "pino": ["pino@10.3.1", "", { "dependencies": { "@pinojs/redact": "^0.4.0", "atomic-sleep": "^1.0.0", "on-exit-leak-free": "^2.1.0", "pino-abstract-transport": "^3.0.0", "pino-std-serializers": "^7.0.0", "process-warning": "^5.0.0", "quick-format-unescaped": "^4.0.3", "real-require": "^0.2.0", "safe-stable-stringify": "^2.3.1", "sonic-boom": "^4.0.1", "thread-stream": "^4.0.0" }, "bin": { "pino": "bin.js" } }, "sha512-r34yH/GlQpKZbU1BvFFqOjhISRo1MNx1tWYsYvmj6KIRHSPMT2+yHOEb1SG6NMvRoHRF0a07kCOox/9yakl1vg=="],
+
+    "pino-abstract-transport": ["pino-abstract-transport@3.0.0", "", { "dependencies": { "split2": "^4.0.0" } }, "sha512-wlfUczU+n7Hy/Ha5j9a/gZNy7We5+cXp8YL+X+PG8S0KXxw7n/JXA3c46Y0zQznIJ83URJiwy7Lh56WLokNuxg=="],
+
+    "pino-pretty": ["pino-pretty@13.1.3", "", { "dependencies": { "colorette": "^2.0.7", "dateformat": "^4.6.3", "fast-copy": "^4.0.0", "fast-safe-stringify": "^2.1.1", "help-me": "^5.0.0", "joycon": "^3.1.1", "minimist": "^1.2.6", "on-exit-leak-free": "^2.1.0", "pino-abstract-transport": "^3.0.0", "pump": "^3.0.0", "secure-json-parse": "^4.0.0", "sonic-boom": "^4.0.1", "strip-json-comments": "^5.0.2" }, "bin": { "pino-pretty": "bin.js" } }, "sha512-ttXRkkOz6WWC95KeY9+xxWL6AtImwbyMHrL1mSwqwW9u+vLp/WIElvHvCSDg0xO/Dzrggz1zv3rN5ovTRVowKg=="],
+
+    "pino-std-serializers": ["pino-std-serializers@7.1.0", "", {}, "sha512-BndPH67/JxGExRgiX1dX0w1FvZck5Wa4aal9198SrRhZjH3GxKQUKIBnYJTdj2HDN3UQAS06HlfcSbQj2OHmaw=="],
 
     "pkg-types": ["pkg-types@2.3.0", "", { "dependencies": { "confbox": "^0.2.2", "exsolve": "^1.0.7", "pathe": "^2.0.3" } }, "sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig=="],
 
@@ -2081,6 +2206,8 @@
 
     "process-nextick-args": ["process-nextick-args@2.0.1", "", {}, "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="],
 
+    "process-warning": ["process-warning@5.0.0", "", {}, "sha512-a39t9ApHNx2L4+HBnQKqxxHNs1r7KF+Intd8Q/g1bUh6q0WIp9voPXJ/x0j+ZL45KF1pJd9+q2jLIRMfvEshkA=="],
+
     "property-information": ["property-information@7.1.0", "", {}, "sha512-TwEZ+X+yCJmYfL7TPUOcvBZ4QfoT5YenQiJuX//0th53DE6w0xxLEtfK3iyryQFddXuvkIk51EEgrJQ0WJkOmQ=="],
 
     "prosemirror-changeset": ["prosemirror-changeset@2.4.0", "", { "dependencies": { "prosemirror-transform": "^1.0.0" } }, "sha512-LvqH2v7Q2SF6yxatuPP2e8vSUKS/L+xAU7dPDC4RMyHMhZoGDfBC74mYuyYF4gLqOEG758wajtyhNnsTkuhvng=="],
@@ -2119,6 +2246,10 @@
 
     "prosemirror-view": ["prosemirror-view@1.41.6", "", { "dependencies": { "prosemirror-model": "^1.20.0", "prosemirror-state": "^1.0.0", "prosemirror-transform": "^1.1.0" } }, "sha512-mxpcDG4hNQa/CPtzxjdlir5bJFDlm0/x5nGBbStB2BWX+XOQ9M8ekEG+ojqB5BcVu2Rc80/jssCMZzSstJuSYg=="],
 
+    "proto-list": ["proto-list@1.2.4", "", {}, "sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA=="],
+
+    "pump": ["pump@3.0.4", "", { "dependencies": { "end-of-stream": "^1.1.0", "once": "^1.3.1" } }, "sha512-VS7sjc6KR7e1ukRFhQSY5LM2uBWAUPiOPa/A3mkKmiMwSmRFUITt0xuj+/lesgnCv+dPIEYlkzrcyXgquIHMcA=="],
+
     "punycode": ["punycode@2.3.1", "", {}, "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg=="],
 
     "punycode.js": ["punycode.js@2.3.1", "", {}, "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA=="],
@@ -2127,20 +2258,24 @@
 
     "queue-microtask": ["queue-microtask@1.2.3", "", {}, "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A=="],
 
+    "quick-format-unescaped": ["quick-format-unescaped@4.0.4", "", {}, "sha512-tYC1Q1hgyRuHgloV/YXs2w15unPVh8qfu/qCTfhTYamaw7fyhumKa2yGpdSo87vY32rIclj+4fWYQXUMs9EHvg=="],
+
     "radix3": ["radix3@1.1.2", "", {}, "sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA=="],
 
     "randombytes": ["randombytes@2.1.0", "", { "dependencies": { "safe-buffer": "^5.1.0" } }, "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ=="],
 
     "range-parser": ["range-parser@1.2.1", "", {}, "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg=="],
 
-    "rc9": ["rc9@2.1.2", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.3" } }, "sha512-btXCnMmRIBINM2LDZoEmOogIZU7Qe7zn4BpomSKZ/ykbLObuBdvG+mFq11DL6fjH1DRwHhrlgtYWG96bJiC7Cg=="],
+    "rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
 
-    "readable-stream": ["readable-stream@3.6.2", "", { "dependencies": { "inherits": "^2.0.3", "string_decoder": "^1.1.1", "util-deprecate": "^1.0.1" } }, "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA=="],
+    "readable-stream": ["readable-stream@2.3.8", "", { "dependencies": { "core-util-is": "~1.0.0", "inherits": "~2.0.3", "isarray": "~1.0.0", "process-nextick-args": "~2.0.0", "safe-buffer": "~5.1.1", "string_decoder": "~1.1.1", "util-deprecate": "~1.0.1" } }, "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA=="],
 
     "readdir-glob": ["readdir-glob@1.1.3", "", { "dependencies": { "minimatch": "^5.1.0" } }, "sha512-v05I2k7xN8zXvPD9N+z/uhXPaj0sUFCe2rcWZIpBsqxfP7xXFQ0tipAd/wjj1YxWyWtUS5IDJpOG82JKt2EAVA=="],
 
     "readdirp": ["readdirp@4.1.2", "", {}, "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg=="],
 
+    "real-require": ["real-require@0.2.0", "", {}, "sha512-57frrGM/OCTLqLOAh0mhVA9VBMHd+9U7Zb2THMGdBUoZVOtGbJzjxsYGDJ3A9AYYCP4hn6y1TVbaOfzWtm5GFg=="],
+
     "redis-errors": ["redis-errors@1.2.0", "", {}, "sha512-1qny3OExCf0UvUV/5wpYKf2YwPcOqXzkwKKSmKHiE6ZMQs5heeE/c8eXK+PNllPvmjgAbfnsbpkGZWy8cBpn9w=="],
 
     "redis-parser": ["redis-parser@3.0.0", "", { "dependencies": { "redis-errors": "^1.0.0" } }, "sha512-DJnGAeenTdpMEH6uAJRK/uiyEIH9WVsUmoLwzudwGJUwZPp80PDBWPHXSAGNPwNvIXAbe7MSUB1zQFugFml66A=="],
@@ -2183,6 +2318,8 @@
 
     "reka-ui": ["reka-ui@2.8.2", "", { "dependencies": { "@floating-ui/dom": "^1.6.13", "@floating-ui/vue": "^1.1.6", "@internationalized/date": "^3.5.0", "@internationalized/number": "^3.5.0", "@tanstack/vue-virtual": "^3.12.0", "@vueuse/core": "^14.1.0", "@vueuse/shared": "^14.1.0", "aria-hidden": "^1.2.4", "defu": "^6.1.4", "ohash": "^2.0.11" }, "peerDependencies": { "vue": ">= 3.2.0" } }, "sha512-8lTKcJhmG+D3UyJxhBnNnW/720sLzm0pbA9AC1MWazmJ5YchJAyTSl+O00xP/kxBmEN0fw5JqWVHguiFmsGjzA=="],
 
+    "remark": ["remark@15.0.1", "", { "dependencies": { "@types/mdast": "^4.0.0", "remark-parse": "^11.0.0", "remark-stringify": "^11.0.0", "unified": "^11.0.0" } }, "sha512-Eht5w30ruCXgFmxVUSlNWQ9iiimq07URKeFS3hNc8cUWy1llX4KDWfyEDZRycMc+znsN9Ux5/tJ/BFdgdOwA3A=="],
+
     "remark-emoji": ["remark-emoji@5.0.2", "", { "dependencies": { "@types/mdast": "^4.0.4", "emoticon": "^4.0.1", "mdast-util-find-and-replace": "^3.0.1", "node-emoji": "^2.1.3", "unified": "^11.0.4" } }, "sha512-IyIqGELcyK5AVdLFafoiNww+Eaw/F+rGrNSXoKucjo95uL267zrddgxGM83GN1wFIb68pyDuAsY3m5t2Cav1pQ=="],
 
     "remark-gfm": ["remark-gfm@4.0.1", "", { "dependencies": { "@types/mdast": "^4.0.0", "mdast-util-gfm": "^3.0.0", "micromark-extension-gfm": "^3.0.0", "remark-parse": "^11.0.0", "remark-stringify": "^11.0.0", "unified": "^11.0.0" } }, "sha512-1quofZ2RQ9EWdeN34S79+KExV1764+wCUGop5CPL1WGdD0ocPpu91lzPGbwWMECpEpd42kJGQwzRfyov9j4yNg=="],
@@ -2195,15 +2332,17 @@
 
     "remark-stringify": ["remark-stringify@11.0.0", "", { "dependencies": { "@types/mdast": "^4.0.0", "mdast-util-to-markdown": "^2.0.0", "unified": "^11.0.0" } }, "sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw=="],
 
+    "require-directory": ["require-directory@2.1.1", "", {}, "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="],
+
     "require-from-string": ["require-from-string@2.0.2", "", {}, "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="],
 
     "resolve": ["resolve@1.22.11", "", { "dependencies": { "is-core-module": "^2.16.1", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, "bin": { "resolve": "bin/resolve" } }, "sha512-RfqAvLnMl313r7c9oclB1HhUEAezcpLjz95wFH4LVuhk9JF/r22qmVP9AMmOU4vMX7Q8pN8jwNg/CSpdFnMjTQ=="],
 
     "resolve-from": ["resolve-from@5.0.0", "", {}, "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw=="],
 
-    "reusify": ["reusify@1.1.0", "", {}, "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw=="],
+    "rettime": ["rettime@0.10.1", "", {}, "sha512-uyDrIlUEH37cinabq0AX4QbgV4HbFZ/gqoiunWQ1UqBtRvTTytwhNYjE++pO/MjPTZL5KQCf2bEoJ/BJNVQ5Kw=="],
 
-    "rfdc": ["rfdc@1.4.1", "", {}, "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA=="],
+    "reusify": ["reusify@1.1.0", "", {}, "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw=="],
 
     "rollup": ["rollup@4.59.0", "", { "dependencies": { "@types/estree": "1.0.8" }, "optionalDependencies": { "@rollup/rollup-android-arm-eabi": "4.59.0", "@rollup/rollup-android-arm64": "4.59.0", "@rollup/rollup-darwin-arm64": "4.59.0", "@rollup/rollup-darwin-x64": "4.59.0", "@rollup/rollup-freebsd-arm64": "4.59.0", "@rollup/rollup-freebsd-x64": "4.59.0", "@rollup/rollup-linux-arm-gnueabihf": "4.59.0", "@rollup/rollup-linux-arm-musleabihf": "4.59.0", "@rollup/rollup-linux-arm64-gnu": "4.59.0", "@rollup/rollup-linux-arm64-musl": "4.59.0", "@rollup/rollup-linux-loong64-gnu": "4.59.0", "@rollup/rollup-linux-loong64-musl": "4.59.0", "@rollup/rollup-linux-ppc64-gnu": "4.59.0", "@rollup/rollup-linux-ppc64-musl": "4.59.0", "@rollup/rollup-linux-riscv64-gnu": "4.59.0", "@rollup/rollup-linux-riscv64-musl": "4.59.0", "@rollup/rollup-linux-s390x-gnu": "4.59.0", "@rollup/rollup-linux-x64-gnu": "4.59.0", "@rollup/rollup-linux-x64-musl": "4.59.0", "@rollup/rollup-openbsd-x64": "4.59.0", "@rollup/rollup-openharmony-arm64": "4.59.0", "@rollup/rollup-win32-arm64-msvc": "4.59.0", "@rollup/rollup-win32-ia32-msvc": "4.59.0", "@rollup/rollup-win32-x64-gnu": "4.59.0", "@rollup/rollup-win32-x64-msvc": "4.59.0", "fsevents": "~2.3.2" }, "bin": { "rollup": "dist/bin/rollup" } }, "sha512-2oMpl67a3zCH9H79LeMcbDhXW/UmWG/y2zuqnF2jQq5uq9TbM9TVyXvA4+t+ne2IIkBdrLpAaRQAvo7YI/Yyeg=="],
 
@@ -2221,7 +2360,7 @@
 
     "safe-array-concat": ["safe-array-concat@1.1.3", "", { "dependencies": { "call-bind": "^1.0.8", "call-bound": "^1.0.2", "get-intrinsic": "^1.2.6", "has-symbols": "^1.1.0", "isarray": "^2.0.5" } }, "sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q=="],
 
-    "safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
+    "safe-buffer": ["safe-buffer@5.1.2", "", {}, "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="],
 
     "safe-push-apply": ["safe-push-apply@1.0.0", "", { "dependencies": { "es-errors": "^1.3.0", "isarray": "^2.0.5" } }, "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA=="],
 
@@ -2241,6 +2380,8 @@
 
     "section-matter": ["section-matter@1.0.0", "", { "dependencies": { "extend-shallow": "^2.0.1", "kind-of": "^6.0.0" } }, "sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA=="],
 
+    "secure-json-parse": ["secure-json-parse@4.1.0", "", {}, "sha512-l4KnYfEyqYJxDwlNVyRfO2E4NTHfMKAWdUuA8J0yve2Dz/E/PdBepY03RvyJpssIpRFwJoCD55wA+mEDs6ByWA=="],
+
     "semver": ["semver@7.7.4", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA=="],
 
     "send": ["send@1.2.1", "", { "dependencies": { "debug": "^4.4.3", "encodeurl": "^2.0.0", "escape-html": "^1.0.3", "etag": "^1.8.1", "fresh": "^2.0.0", "http-errors": "^2.0.1", "mime-types": "^3.0.2", "ms": "^2.1.3", "on-finished": "^2.4.1", "range-parser": "^1.2.1", "statuses": "^2.0.2" } }, "sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ=="],
@@ -2259,6 +2400,8 @@
 
     "set-proto": ["set-proto@1.0.0", "", { "dependencies": { "dunder-proto": "^1.0.1", "es-errors": "^1.3.0", "es-object-atoms": "^1.0.0" } }, "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw=="],
 
+    "setimmediate": ["setimmediate@1.0.5", "", {}, "sha512-MATJdZp8sLqDl/68LfQmbP8zKPLQNV6BIZoIgrscFDQ+RsvK/BxeDQOgyxKKoh0y/8h3BqVFnCqQ/gd+reiIXA=="],
+
     "setprototypeof": ["setprototypeof@1.2.0", "", {}, "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw=="],
 
     "shebang-command": ["shebang-command@2.0.0", "", { "dependencies": { "shebang-regex": "^3.0.0" } }, "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA=="],
@@ -2277,6 +2420,8 @@
 
     "side-channel-weakmap": ["side-channel-weakmap@1.0.2", "", { "dependencies": { "call-bound": "^1.0.2", "es-errors": "^1.3.0", "get-intrinsic": "^1.2.5", "object-inspect": "^1.13.3", "side-channel-map": "^1.0.1" } }, "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A=="],
 
+    "siginfo": ["siginfo@2.0.0", "", {}, "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g=="],
+
     "signal-exit": ["signal-exit@4.1.0", "", {}, "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw=="],
 
     "simple-git": ["simple-git@3.32.3", "", { "dependencies": { "@kwsites/file-exists": "^1.1.1", "@kwsites/promise-deferred": "^1.1.1", "debug": "^4.4.0" } }, "sha512-56a5oxFdWlsGygOXHWrG+xjj5w9ZIt2uQbzqiIGdR/6i5iococ7WQ/bNPzWxCJdEUGUCmyMH0t9zMpRJTaKxmw=="],
@@ -2291,6 +2436,8 @@
 
     "smob": ["smob@1.6.1", "", {}, "sha512-KAkBqZl3c2GvNgNhcoyJae1aKldDW0LO279wF9bk1PnluRTETKBq0WyzRXxEhoQLk56yHaOY4JCBEKDuJIET5g=="],
 
+    "sonic-boom": ["sonic-boom@4.2.1", "", { "dependencies": { "atomic-sleep": "^1.0.0" } }, "sha512-w6AxtubXa2wTXAUsZMMWERrsIRAdrK0Sc+FUytWvYAhBJLyuI4llrMIC1DtlNSdI99EI86KZum2MMq3EAZlF9Q=="],
+
     "source-map": ["source-map@0.8.0-beta.0", "", { "dependencies": { "whatwg-url": "^7.0.0" } }, "sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA=="],
 
     "source-map-js": ["source-map-js@1.2.1", "", {}, "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="],
@@ -2301,13 +2448,13 @@
 
     "space-separated-tokens": ["space-separated-tokens@2.0.2", "", {}, "sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q=="],
 
-    "speakingurl": ["speakingurl@14.0.1", "", {}, "sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ=="],
+    "split2": ["split2@4.2.0", "", {}, "sha512-UcjcJOWknrNkF6PLX83qcHM6KHgVKNkV62Y8a5uYDVv9ydGQVwAHMKqHdJje1VTWpljG0WYpCDhrCdAOYH4TWg=="],
 
     "sprintf-js": ["sprintf-js@1.0.3", "", {}, "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g=="],
 
-    "srvx": ["srvx@0.11.8", "", { "bin": { "srvx": "bin/srvx.mjs" } }, "sha512-2n9t0YnAXPJjinytvxccNgs7rOA5gmE7Wowt/8Dy2dx2fDC6sBhfBpbrCvjYKALlVukPS/Uq3QwkolKNa7P/2Q=="],
+    "srvx": ["srvx@0.10.1", "", { "bin": { "srvx": "bin/srvx.mjs" } }, "sha512-A//xtfak4eESMWWydSRFUVvCTQbSwivnGCEf8YGPe2eHU0+Z6znfUTCPF0a7oV3sObSOcrXHlL6Bs9vVctfXdg=="],
 
-    "stack-trace": ["stack-trace@0.0.10", "", {}, "sha512-KGzahc7puUKkzyMt+IqAep+TVNbKP+k2Lmwhub39m1AsTSkaDutx56aDCo+HLDzf/D26BIHTJWNiTG1KAJiQCg=="],
+    "stackback": ["stackback@0.0.2", "", {}, "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw=="],
 
     "standard-as-callback": ["standard-as-callback@2.1.0", "", {}, "sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A=="],
 
@@ -2319,7 +2466,9 @@
 
     "streamx": ["streamx@2.23.0", "", { "dependencies": { "events-universal": "^1.0.0", "fast-fifo": "^1.3.2", "text-decoder": "^1.1.0" } }, "sha512-kn+e44esVfn2Fa/O0CPFcex27fjIL6MkVae0Mm6q+E6f0hWv578YCERbv+4m02cjxvDsPKLnmxral/rR6lBMAg=="],
 
-    "string-width": ["string-width@7.2.0", "", { "dependencies": { "emoji-regex": "^10.3.0", "get-east-asian-width": "^1.0.0", "strip-ansi": "^7.1.0" } }, "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ=="],
+    "strict-event-emitter": ["strict-event-emitter@0.5.1", "", {}, "sha512-vMgjE/GGEPEFnhFub6pa4FmJBRBVOLpIII2hvCZ8Kzb7K0hlHo7mQv6xYrBvCL2LtAIBwFUK8wvuJgTVSQ5MFQ=="],
+
+    "string-width": ["string-width@4.2.3", "", { "dependencies": { "emoji-regex": "^8.0.0", "is-fullwidth-code-point": "^3.0.0", "strip-ansi": "^6.0.1" } }, "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g=="],
 
     "string-width-cjs": ["string-width@4.2.3", "", { "dependencies": { "emoji-regex": "^8.0.0", "is-fullwidth-code-point": "^3.0.0", "strip-ansi": "^6.0.1" } }, "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g=="],
 
@@ -2331,13 +2480,13 @@
 
     "string.prototype.trimstart": ["string.prototype.trimstart@1.0.8", "", { "dependencies": { "call-bind": "^1.0.7", "define-properties": "^1.2.1", "es-object-atoms": "^1.0.0" } }, "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg=="],
 
-    "string_decoder": ["string_decoder@1.3.0", "", { "dependencies": { "safe-buffer": "~5.2.0" } }, "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA=="],
+    "string_decoder": ["string_decoder@1.1.1", "", { "dependencies": { "safe-buffer": "~5.1.0" } }, "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg=="],
 
     "stringify-entities": ["stringify-entities@4.0.4", "", { "dependencies": { "character-entities-html4": "^2.0.0", "character-entities-legacy": "^3.0.0" } }, "sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg=="],
 
     "stringify-object": ["stringify-object@3.3.0", "", { "dependencies": { "get-own-enumerable-property-symbols": "^3.0.0", "is-obj": "^1.0.1", "is-regexp": "^1.0.0" } }, "sha512-rHqiFh1elqCQ9WPLIC8I0Q/g/wj5J1eMkyoiD6eoQApWHP0FtlK7rqnhmabL5VUY9JQCcqwwvlOaSuutekgyrw=="],
 
-    "strip-ansi": ["strip-ansi@7.2.0", "", { "dependencies": { "ansi-regex": "^6.2.2" } }, "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w=="],
+    "strip-ansi": ["strip-ansi@6.0.1", "", { "dependencies": { "ansi-regex": "^5.0.1" } }, "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A=="],
 
     "strip-ansi-cjs": ["strip-ansi@6.0.1", "", { "dependencies": { "ansi-regex": "^5.0.1" } }, "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A=="],
 
@@ -2347,15 +2496,15 @@
 
     "strip-final-newline": ["strip-final-newline@3.0.0", "", {}, "sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw=="],
 
+    "strip-json-comments": ["strip-json-comments@5.0.3", "", {}, "sha512-1tB5mhVo7U+ETBKNf92xT4hrQa3pm0MZ0PQvuDnWgAAGHDsfp4lPSpiS6psrSiet87wyGPh9ft6wmhOMQ0hDiw=="],
+
     "strip-literal": ["strip-literal@3.1.0", "", { "dependencies": { "js-tokens": "^9.0.1" } }, "sha512-8r3mkIM/2+PpjHoOtiAW8Rg3jJLHaV7xPwG+YRGrv6FP0wwk/toTpATxWYOW0BKdWwl82VT2tFYi5DlROa0Mxg=="],
 
     "structured-clone-es": ["structured-clone-es@1.0.0", "", {}, "sha512-FL8EeKFFyNQv5cMnXI31CIMCsFarSVI2bF0U0ImeNE3g/F1IvJQyqzOXxPBRXiwQfyBTlbNe88jh1jFW0O/jiQ=="],
 
     "stylehacks": ["stylehacks@7.0.7", "", { "dependencies": { "browserslist": "^4.27.0", "postcss-selector-parser": "^7.1.0" }, "peerDependencies": { "postcss": "^8.4.32" } }, "sha512-bJkD0JkEtbRrMFtwgpJyBbFIwfDDONQ1Ov3sDLZQP8HuJ73kBOyx66H4bOcAbVWmnfLdvQ0AJwXxOMkpujcO6g=="],
 
-    "superjson": ["superjson@2.2.6", "", { "dependencies": { "copy-anything": "^4" } }, "sha512-H+ue8Zo4vJmV2nRjpx86P35lzwDT3nItnIsocgumgr0hHMQ+ZGq5vrERg9kJBo5AWGmxZDhzDo+WVIJqkB0cGA=="],
-
-    "supports-color": ["supports-color@10.2.2", "", {}, "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g=="],
+    "supports-color": ["supports-color@7.2.0", "", { "dependencies": { "has-flag": "^4.0.0" } }, "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw=="],
 
     "supports-preserve-symlinks-flag": ["supports-preserve-symlinks-flag@1.0.0", "", {}, "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w=="],
 
@@ -2387,16 +2536,24 @@
 
     "text-decoder": ["text-decoder@1.2.7", "", { "dependencies": { "b4a": "^1.6.4" } }, "sha512-vlLytXkeP4xvEq2otHeJfSQIRyWxo/oZGEbXrtEEF9Hnmrdly59sUbzZ/QgyWuLYHctCHxFF4tRQZNQ9k60ExQ=="],
 
-    "text-hex": ["text-hex@1.0.0", "", {}, "sha512-uuVGNWzgJ4yhRaNSiubPY7OjISw4sw4E5Uv0wbjp+OzcbmVU/rsT8ujgcXJhn9ypzsgr5vlzpPqP+MBBKcGvbg=="],
+    "thread-stream": ["thread-stream@4.0.0", "", { "dependencies": { "real-require": "^0.2.0" } }, "sha512-4iMVL6HAINXWf1ZKZjIPcz5wYaOdPhtO8ATvZ+Xqp3BTdaqtAwQkNmKORqcIo5YkQqGXq5cwfswDwMqqQNrpJA=="],
 
     "tiny-inflate": ["tiny-inflate@1.0.3", "", {}, "sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw=="],
 
     "tiny-invariant": ["tiny-invariant@1.3.3", "", {}, "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="],
 
+    "tinybench": ["tinybench@2.9.0", "", {}, "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg=="],
+
     "tinyexec": ["tinyexec@1.0.2", "", {}, "sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg=="],
 
     "tinyglobby": ["tinyglobby@0.2.15", "", { "dependencies": { "fdir": "^6.5.0", "picomatch": "^4.0.3" } }, "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ=="],
 
+    "tinyrainbow": ["tinyrainbow@3.0.3", "", {}, "sha512-PSkbLUoxOFRzJYjjxHJt9xro7D+iilgMX/C9lawzVuYiIdcihh9DXmVibBe8lmcFrRi/VzlPjBxbN7rH24q8/Q=="],
+
+    "tldts": ["tldts@7.0.23", "", { "dependencies": { "tldts-core": "^7.0.23" }, "bin": { "tldts": "bin/cli.js" } }, "sha512-ASdhgQIBSay0R/eXggAkQ53G4nTJqTXqC2kbaBbdDwM7SkjyZyO0OaaN1/FH7U/yCeqOHDwFO5j8+Os/IS1dXw=="],
+
+    "tldts-core": ["tldts-core@7.0.23", "", {}, "sha512-0g9vrtDQLrNIiCj22HSe9d4mLVG3g5ph5DZ8zCKBr4OtrspmNB6ss7hVyzArAeE88ceZocIEGkyW1Ime7fxPtQ=="],
+
     "to-regex-range": ["to-regex-range@5.0.1", "", { "dependencies": { "is-number": "^7.0.0" } }, "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ=="],
 
     "toidentifier": ["toidentifier@1.0.1", "", {}, "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA=="],
@@ -2405,14 +2562,14 @@
 
     "totalist": ["totalist@3.0.1", "", {}, "sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ=="],
 
+    "tough-cookie": ["tough-cookie@6.0.0", "", { "dependencies": { "tldts": "^7.0.5" } }, "sha512-kXuRi1mtaKMrsLUxz3sQYvVl37B0Ns6MzfrtV5DvJceE9bPyspOqk9xxv7XbZWcfLWbFmm997vl83qUWVJA64w=="],
+
     "tr46": ["tr46@1.0.1", "", { "dependencies": { "punycode": "^2.1.0" } }, "sha512-dTpowEjclQ7Kgx5SdBkqRzVhERQXov8/l9Ft9dVM9fmg0W0KQSVaXX9T4i6twCPNtYiZM53lpSSUAwJbFPOHxA=="],
 
     "trim-lines": ["trim-lines@3.0.1", "", {}, "sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg=="],
 
     "trim-trailing-lines": ["trim-trailing-lines@2.1.0", "", {}, "sha512-5UR5Biq4VlVOtzqkm2AZlgvSlDJtME46uV0br0gENbwN4l5+mMKT4b9gJKqWtuL2zAIqajGJGuvbCbcAJUZqBg=="],
 
-    "triple-beam": ["triple-beam@1.4.1", "", {}, "sha512-aZbgViZrg1QNcG+LULa7nhZpJTZSLm/mXnHXnbAbjmN5aSa0y7V+wvv6+4WaBtpISJzThKy+PIPxc1Nq1EJ9mg=="],
-
     "trough": ["trough@2.2.0", "", {}, "sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw=="],
 
     "ts-api-utils": ["ts-api-utils@2.4.0", "", { "peerDependencies": { "typescript": ">=4.8.4" } }, "sha512-3TaVTaAv2gTiMB35i3FiGJaRfwb3Pyn/j3m/bfAvGe8FB7CF6u+LMYqYlDh7reQf7UNvoTvdfAqHGmPGOSsPmA=="],
@@ -2423,7 +2580,7 @@
 
     "type-check": ["type-check@0.4.0", "", { "dependencies": { "prelude-ls": "^1.2.1" } }, "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew=="],
 
-    "type-fest": ["type-fest@0.16.0", "", {}, "sha512-eaBzG6MxNzEn9kiwvtre90cXaNLkmadMWa1zQMs3XORCXNbsH/OewwbxC5ia9dCxIxnTAsSxXJaa/p5y8DlvJg=="],
+    "type-fest": ["type-fest@5.4.4", "", { "dependencies": { "tagged-tag": "^1.0.0" } }, "sha512-JnTrzGu+zPV3aXIUhnyWJj4z/wigMsdYajGLIYakqyOW1nPllzXEJee0QQbHj+CTIQtXGlAjuK0UY+2xTyjVAw=="],
 
     "type-level-regexp": ["type-level-regexp@0.1.17", "", {}, "sha512-wTk4DH3cxwk196uGLK/E9pE45aLfeKJacKmcEgEOA/q5dnPGNxXt0cfYdFxb57L+sEpf1oJH4Dnx/pnRcku9jg=="],
 
@@ -2505,6 +2662,8 @@
 
     "unstorage": ["unstorage@1.17.4", "", { "dependencies": { "anymatch": "^3.1.3", "chokidar": "^5.0.0", "destr": "^2.0.5", "h3": "^1.15.5", "lru-cache": "^11.2.0", "node-fetch-native": "^1.6.7", "ofetch": "^1.5.1", "ufo": "^1.6.3" }, "peerDependencies": { "@azure/app-configuration": "^1.8.0", "@azure/cosmos": "^4.2.0", "@azure/data-tables": "^13.3.0", "@azure/identity": "^4.6.0", "@azure/keyvault-secrets": "^4.9.0", "@azure/storage-blob": "^12.26.0", "@capacitor/preferences": "^6 || ^7 || ^8", "@deno/kv": ">=0.9.0", "@netlify/blobs": "^6.5.0 || ^7.0.0 || ^8.1.0 || ^9.0.0 || ^10.0.0", "@planetscale/database": "^1.19.0", "@upstash/redis": "^1.34.3", "@vercel/blob": ">=0.27.1", "@vercel/functions": "^2.2.12 || ^3.0.0", "@vercel/kv": "^1 || ^2 || ^3", "aws4fetch": "^1.0.20", "db0": ">=0.2.1", "idb-keyval": "^6.2.1", "ioredis": "^5.4.2", "uploadthing": "^7.4.4" }, "optionalPeers": ["@azure/app-configuration", "@azure/cosmos", "@azure/data-tables", "@azure/identity", "@azure/keyvault-secrets", "@azure/storage-blob", "@capacitor/preferences", "@deno/kv", "@netlify/blobs", "@planetscale/database", "@upstash/redis", "@vercel/blob", "@vercel/functions", "@vercel/kv", "aws4fetch", "db0", "idb-keyval", "ioredis", "uploadthing"] }, "sha512-fHK0yNg38tBiJKp/Vgsq4j0JEsCmgqH58HAn707S7zGkArbZsVr/CwINoi+nh3h98BRCwKvx1K3Xg9u3VV83sw=="],
 
+    "until-async": ["until-async@3.0.2", "", {}, "sha512-IiSk4HlzAMqTUseHHe3VhIGyuFmN90zMTpD3Z3y8jeQbzLIq500MVM7Jq2vUAnTKAFPJrqwkzr6PoTcPhGcOiw=="],
+
     "untun": ["untun@0.1.3", "", { "dependencies": { "citty": "^0.1.5", "consola": "^3.2.3", "pathe": "^1.1.1" }, "bin": { "untun": "bin/untun.mjs" } }, "sha512-4luGP9LMYszMRZwsvyUd9MrxgEGZdZuZgpVQHEEX0lCYFESasVRvZd0EYpCkOIbJKHMuv0LskpXc/8Un+MJzEQ=="],
 
     "untyped": ["untyped@2.0.0", "", { "dependencies": { "citty": "^0.1.6", "defu": "^6.1.4", "jiti": "^2.4.2", "knitwork": "^1.2.0", "scule": "^1.3.0" }, "bin": { "untyped": "dist/cli.mjs" } }, "sha512-nwNCjxJTjNuLCgFr42fEak5OcLuB3ecca+9ksPFNvtfYSLpjf+iJqSIaSnIile6ZPbKYxI5k2AfXqeopGudK/g=="],
@@ -2547,13 +2706,17 @@
 
     "vite-plugin-vue-tracer": ["vite-plugin-vue-tracer@1.2.0", "", { "dependencies": { "estree-walker": "^3.0.3", "exsolve": "^1.0.8", "magic-string": "^0.30.21", "pathe": "^2.0.3", "source-map-js": "^1.2.1" }, "peerDependencies": { "vite": "^6.0.0 || ^7.0.0", "vue": "^3.5.0" } }, "sha512-a9Z/TLpxwmoE9kIcv28wqQmiszM7ec4zgndXWEsVD/2lEZLRGzcg7ONXmplzGF/UP5W59QNtS809OdywwpUWQQ=="],
 
+    "vitest": ["vitest@4.0.18", "", { "dependencies": { "@vitest/expect": "4.0.18", "@vitest/mocker": "4.0.18", "@vitest/pretty-format": "4.0.18", "@vitest/runner": "4.0.18", "@vitest/snapshot": "4.0.18", "@vitest/spy": "4.0.18", "@vitest/utils": "4.0.18", "es-module-lexer": "^1.7.0", "expect-type": "^1.2.2", "magic-string": "^0.30.21", "obug": "^2.1.1", "pathe": "^2.0.3", "picomatch": "^4.0.3", "std-env": "^3.10.0", "tinybench": "^2.9.0", "tinyexec": "^1.0.2", "tinyglobby": "^0.2.15", "tinyrainbow": "^3.0.3", "vite": "^6.0.0 || ^7.0.0", "why-is-node-running": "^2.3.0" }, "peerDependencies": { "@edge-runtime/vm": "*", "@opentelemetry/api": "^1.9.0", "@types/node": "^20.0.0 || ^22.0.0 || >=24.0.0", "@vitest/browser-playwright": "4.0.18", "@vitest/browser-preview": "4.0.18", "@vitest/browser-webdriverio": "4.0.18", "@vitest/ui": "4.0.18", "happy-dom": "*", "jsdom": "*" }, "optionalPeers": ["@edge-runtime/vm", "@opentelemetry/api", "@types/node", "@vitest/browser-playwright", "@vitest/browser-preview", "@vitest/browser-webdriverio", "@vitest/ui", "happy-dom", "jsdom"], "bin": { "vitest": "vitest.mjs" } }, "sha512-hOQuK7h0FGKgBAas7v0mSAsnvrIgAvWmRFjmzpJ7SwFHH3g1k2u37JtYwOwmEKhK6ZO3v9ggDBBm0La1LCK4uQ=="],
+
+    "vitest-environment-nuxt": ["vitest-environment-nuxt@1.0.1", "", { "dependencies": { "@nuxt/test-utils": ">=3.13.1" } }, "sha512-eBCwtIQriXW5/M49FjqNKfnlJYlG2LWMSNFsRVKomc8CaMqmhQPBS5LZ9DlgYL9T8xIVsiA6RZn2lk7vxov3Ow=="],
+
     "vscode-uri": ["vscode-uri@3.1.0", "", {}, "sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ=="],
 
     "vue": ["vue@3.5.29", "", { "dependencies": { "@vue/compiler-dom": "3.5.29", "@vue/compiler-sfc": "3.5.29", "@vue/runtime-dom": "3.5.29", "@vue/server-renderer": "3.5.29", "@vue/shared": "3.5.29" }, "peerDependencies": { "typescript": "*" }, "optionalPeers": ["typescript"] }, "sha512-BZqN4Ze6mDQVNAni0IHeMJ5mwr8VAJ3MQC9FmprRhcBYENw+wOAAjRj8jfmN6FLl0j96OXbR+CjWhmAmM+QGnA=="],
 
     "vue-bundle-renderer": ["vue-bundle-renderer@2.2.0", "", { "dependencies": { "ufo": "^1.6.1" } }, "sha512-sz/0WEdYH1KfaOm0XaBmRZOWgYTEvUDt6yPYaUzl4E52qzgWLlknaPPTTZmp6benaPTlQAI/hN1x3tAzZygycg=="],
 
-    "vue-component-type-helpers": ["vue-component-type-helpers@3.2.5", "", {}, "sha512-tkvNr+bU8+xD/onAThIe7CHFvOJ/BO6XCOrxMzeytJq40nTfpGDJuVjyCM8ccGZKfAbGk2YfuZyDMXM56qheZQ=="],
+    "vue-component-type-helpers": ["vue-component-type-helpers@2.2.12", "", {}, "sha512-YbGqHZ5/eW4SnkPNR44mKVc6ZKQoRs/Rux1sxC6rdwXb4qpbOSYfDr9DsTHolOTGmIKgM9j141mZbBeg05R1pw=="],
 
     "vue-demi": ["vue-demi@0.14.10", "", { "peerDependencies": { "@vue/composition-api": "^1.0.0-rc.1", "vue": "^3.0.0-0 || ^2.6.0" }, "optionalPeers": ["@vue/composition-api"], "bin": { "vue-demi-fix": "bin/vue-demi-fix.js", "vue-demi-switch": "bin/vue-demi-switch.js" } }, "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg=="],
 
@@ -2575,6 +2738,8 @@
 
     "webpack-virtual-modules": ["webpack-virtual-modules@0.6.2", "", {}, "sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ=="],
 
+    "whatwg-mimetype": ["whatwg-mimetype@3.0.0", "", {}, "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q=="],
+
     "whatwg-url": ["whatwg-url@7.1.0", "", { "dependencies": { "lodash.sortby": "^4.7.0", "tr46": "^1.0.1", "webidl-conversions": "^4.0.2" } }, "sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg=="],
 
     "wheel-gestures": ["wheel-gestures@2.2.48", "", {}, "sha512-f+Gy33Oa5Z14XY9679Zze+7VFhbsQfBFXodnU2x589l4kxGM9L5Y8zETTmcMR5pWOPQyRv4Z0lNax6xCO0NSlA=="],
@@ -2589,9 +2754,7 @@
 
     "which-typed-array": ["which-typed-array@1.1.20", "", { "dependencies": { "available-typed-arrays": "^1.0.7", "call-bind": "^1.0.8", "call-bound": "^1.0.4", "for-each": "^0.3.5", "get-proto": "^1.0.1", "gopd": "^1.2.0", "has-tostringtag": "^1.0.2" } }, "sha512-LYfpUkmqwl0h9A2HL09Mms427Q1RZWuOHsukfVcKRq9q95iQxdw0ix1JQrqbcDR9PH1QDwf5Qo8OZb5lksZ8Xg=="],
 
-    "winston": ["winston@3.19.0", "", { "dependencies": { "@colors/colors": "^1.6.0", "@dabh/diagnostics": "^2.0.8", "async": "^3.2.3", "is-stream": "^2.0.0", "logform": "^2.7.0", "one-time": "^1.0.0", "readable-stream": "^3.4.0", "safe-stable-stringify": "^2.3.1", "stack-trace": "0.0.x", "triple-beam": "^1.3.0", "winston-transport": "^4.9.0" } }, "sha512-LZNJgPzfKR+/J3cHkxcpHKpKKvGfDZVPS4hfJCc4cCG0CgYzvlD6yE/S3CIL/Yt91ak327YCpiF/0MyeZHEHKA=="],
-
-    "winston-transport": ["winston-transport@4.9.0", "", { "dependencies": { "logform": "^2.7.0", "readable-stream": "^3.6.2", "triple-beam": "^1.3.0" } }, "sha512-8drMJ4rkgaPo1Me4zD/3WLfI/zPdA9o2IipKODunnGDcuqbHwjsbB79ylv04LCGGzU0xQ6vTznOMpQGaLhhm6A=="],
+    "why-is-node-running": ["why-is-node-running@2.3.0", "", { "dependencies": { "siginfo": "^2.0.0", "stackback": "0.0.2" }, "bin": { "why-is-node-running": "cli.js" } }, "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w=="],
 
     "word-wrap": ["word-wrap@1.2.5", "", {}, "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA=="],
 
@@ -2627,14 +2790,20 @@
 
     "workbox-window": ["workbox-window@7.4.0", "", { "dependencies": { "@types/trusted-types": "^2.0.2", "workbox-core": "7.4.0" } }, "sha512-/bIYdBLAVsNR3v7gYGaV4pQW3M3kEPx5E8vDxGvxo6khTrGtSSCS7QiFKv9ogzBgZiy0OXLP9zO28U/1nF1mfw=="],
 
-    "wrap-ansi": ["wrap-ansi@9.0.2", "", { "dependencies": { "ansi-styles": "^6.2.1", "string-width": "^7.0.0", "strip-ansi": "^7.1.0" } }, "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww=="],
+    "wrap-ansi": ["wrap-ansi@6.2.0", "", { "dependencies": { "ansi-styles": "^4.0.0", "string-width": "^4.1.0", "strip-ansi": "^6.0.0" } }, "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA=="],
 
     "wrap-ansi-cjs": ["wrap-ansi@7.0.0", "", { "dependencies": { "ansi-styles": "^4.0.0", "string-width": "^4.1.0", "strip-ansi": "^6.0.0" } }, "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q=="],
 
+    "wrappy": ["wrappy@1.0.2", "", {}, "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="],
+
     "ws": ["ws@8.19.0", "", { "peerDependencies": { "bufferutil": "^4.0.1", "utf-8-validate": ">=5.0.2" }, "optionalPeers": ["bufferutil", "utf-8-validate"] }, "sha512-blAT2mjOEIi0ZzruJfIhb3nps74PRWTCz1IjglWEEpQl5XS/UNama6u2/rjFkDDouqr4L67ry+1aGIALViWjDg=="],
 
     "wsl-utils": ["wsl-utils@0.1.0", "", { "dependencies": { "is-wsl": "^3.1.0" } }, "sha512-h3Fbisa2nKGPxCpm89Hk33lBLsnaGBvctQopaBSOW/uIs6FTe1ATyAnKFJrzVs9vpGdsTe73WF3V4lIsk4Gacw=="],
 
+    "xml": ["xml@1.0.1", "", {}, "sha512-huCv9IH9Tcf95zuYCsQraZtWnJvBtLVE0QHMOs8bWyZAFZNDcYjsPq1nEx8jKA9y+Beo9v+7OBPRisQTjinQMw=="],
+
+    "xml-js": ["xml-js@1.6.11", "", { "dependencies": { "sax": "^1.2.4" }, "bin": { "xml-js": "./bin/cli.js" } }, "sha512-7rVi2KMfwfWFl+GpPg6m80IVMWXLRjO+PxTq7V2CDhoGak0wzYzFgUY2m4XJ47OGdXd8eLE8EmwfAmdjw7lC1g=="],
+
     "y-protocols": ["y-protocols@1.0.7", "", { "dependencies": { "lib0": "^0.2.85" }, "peerDependencies": { "yjs": "^13.0.0" } }, "sha512-YSVsLoXxO67J6eE/nV4AtFtT3QEotZf5sK5BHxFBXso7VDUT3Tx07IfA6hsu5Q5OmBdMkQVmFZ9QOA7fikWvnw=="],
 
     "y18n": ["y18n@5.0.8", "", {}, "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA=="],
@@ -2645,14 +2814,16 @@
 
     "yaml-eslint-parser": ["yaml-eslint-parser@1.3.2", "", { "dependencies": { "eslint-visitor-keys": "^3.0.0", "yaml": "^2.0.0" } }, "sha512-odxVsHAkZYYglR30aPYRY4nUGJnoJ2y1ww2HDvZALo0BDETv9kWbi16J52eHs+PWRNmF4ub6nZqfVOeesOvntg=="],
 
-    "yargs": ["yargs@18.0.0", "", { "dependencies": { "cliui": "^9.0.1", "escalade": "^3.1.1", "get-caller-file": "^2.0.5", "string-width": "^7.2.0", "y18n": "^5.0.5", "yargs-parser": "^22.0.0" } }, "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg=="],
+    "yargs": ["yargs@17.7.2", "", { "dependencies": { "cliui": "^8.0.1", "escalade": "^3.1.1", "get-caller-file": "^2.0.5", "require-directory": "^2.1.1", "string-width": "^4.2.3", "y18n": "^5.0.5", "yargs-parser": "^21.1.1" } }, "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w=="],
 
-    "yargs-parser": ["yargs-parser@22.0.0", "", {}, "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw=="],
+    "yargs-parser": ["yargs-parser@21.1.1", "", {}, "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw=="],
 
     "yjs": ["yjs@13.6.29", "", { "dependencies": { "lib0": "^0.2.99" } }, "sha512-kHqDPdltoXH+X4w1lVmMtddE3Oeqq48nM40FD5ojTd8xYhQpzIDcfE2keMSU5bAgRPJBe225WTUdyUgj1DtbiQ=="],
 
     "yocto-queue": ["yocto-queue@0.1.0", "", {}, "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="],
 
+    "yoctocolors-cjs": ["yoctocolors-cjs@2.1.3", "", {}, "sha512-U/PBtDf35ff0D8X8D0jfdzHYEPFxAI7jJlxZXwCSez5M3190m+QobIfh+sWDWSHMCWWJN2AWamkegn6vr6YBTw=="],
+
     "youch": ["youch@4.1.0", "", { "dependencies": { "@poppinss/colors": "^4.1.6", "@poppinss/dumper": "^0.7.0", "@speed-highlight/core": "^1.2.14", "cookie-es": "^2.0.0", "youch-core": "^0.3.3" } }, "sha512-cYekNh2tUoU+voS11X0D0UQntVCSO6LQ1h10VriQGmfbpf0mnGTruwZICts23UUNiZCXm8H8hQBtRrdsbhuNNg=="],
 
     "youch-core": ["youch-core@0.3.3", "", { "dependencies": { "@poppinss/exception": "^1.2.2", "error-stack-parser-es": "^1.0.5" } }, "sha512-ho7XuGjLaJ2hWHoK8yFnsUGy2Y5uDpqSTq1FkHLK4/oqKtyUU1AFbOOxY4IpC9f0fTLjwYbslUz0Po5BpD1wrA=="],
@@ -2677,49 +2848,73 @@
 
     "@babel/preset-env/semver": ["semver@6.3.1", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA=="],
 
-    "@dcc-bs/audio-recorder.bs.js/@nuxtjs/i18n": ["@nuxtjs/i18n@10.2.1", "", { "dependencies": { "@intlify/core": "^11.1.11", "@intlify/h3": "^0.7.1", "@intlify/shared": "^11.1.11", "@intlify/unplugin-vue-i18n": "^11.0.0", "@intlify/utils": "^0.13.0", "@miyaneee/rollup-plugin-json5": "^1.2.0", "@nuxt/kit": "^4.1.2", "@rollup/plugin-yaml": "^4.1.2", "@vue/compiler-sfc": "^3.5.22", "defu": "^6.1.4", "devalue": "^5.1.1", "h3": "^1.15.4", "knitwork": "^1.2.0", "magic-string": "^0.30.21", "mlly": "^1.7.4", "nuxt-define": "^1.0.0", "ohash": "^2.0.11", "oxc-parser": "^0.95.0", "oxc-transform": "^0.95.0", "oxc-walker": "^0.5.2", "pathe": "^2.0.3", "typescript": "^5.9.2", "ufo": "^1.6.1", "unplugin": "^2.3.5", "unplugin-vue-router": "^0.16.0", "unstorage": "^1.16.1", "vue-i18n": "^11.1.11", "vue-router": "^4.6.3" } }, "sha512-/CHAIpYbFgobxeMsnKcD8xBUHxBpqipRMjaI3ol9MVZKscJM+IetYdNL9lGNFdEtlxzkV8COxnoa60rE4sPjuQ=="],
+    "@dcc-bs/audio-recorder.bs.js/@nuxt/kit": ["@nuxt/kit@4.2.1", "", { "dependencies": { "c12": "^3.3.1", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.7", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^2.1.2", "scule": "^1.3.0", "semver": "^7.7.3", "tinyglobby": "^0.2.15", "ufo": "^1.6.1", "unctx": "^2.4.1", "untyped": "^2.0.0" } }, "sha512-lLt8KLHyl7IClc3RqRpRikz15eCfTRlAWL9leVzPyg5N87FfKE/7EWgWvpiL/z4Tf3dQCIqQb88TmHE0JTIDvA=="],
 
-    "@dcc-bs/common-ui.bs.js/@nuxt/kit": ["@nuxt/kit@4.2.2", "", { "dependencies": { "c12": "^3.3.2", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^2.1.2", "scule": "^1.3.0", "semver": "^7.7.3", "tinyglobby": "^0.2.15", "ufo": "^1.6.1", "unctx": "^2.4.1", "untyped": "^2.0.0" } }, "sha512-ZAgYBrPz/yhVgDznBNdQj2vhmOp31haJbO0I0iah/P9atw+OHH7NJLUZ3PK+LOz/0fblKTN1XJVSi8YQ1TQ0KA=="],
+    "@dcc-bs/audio-recorder.bs.js/@nuxtjs/i18n": ["@nuxtjs/i18n@10.2.1", "", { "dependencies": { "@intlify/core": "^11.1.11", "@intlify/h3": "^0.7.1", "@intlify/shared": "^11.1.11", "@intlify/unplugin-vue-i18n": "^11.0.0", "@intlify/utils": "^0.13.0", "@miyaneee/rollup-plugin-json5": "^1.2.0", "@nuxt/kit": "^4.1.2", "@rollup/plugin-yaml": "^4.1.2", "@vue/compiler-sfc": "^3.5.22", "defu": "^6.1.4", "devalue": "^5.1.1", "h3": "^1.15.4", "knitwork": "^1.2.0", "magic-string": "^0.30.21", "mlly": "^1.7.4", "nuxt-define": "^1.0.0", "ohash": "^2.0.11", "oxc-parser": "^0.95.0", "oxc-transform": "^0.95.0", "oxc-walker": "^0.5.2", "pathe": "^2.0.3", "typescript": "^5.9.2", "ufo": "^1.6.1", "unplugin": "^2.3.5", "unplugin-vue-router": "^0.16.0", "unstorage": "^1.16.1", "vue-i18n": "^11.1.11", "vue-router": "^4.6.3" } }, "sha512-/CHAIpYbFgobxeMsnKcD8xBUHxBpqipRMjaI3ol9MVZKscJM+IetYdNL9lGNFdEtlxzkV8COxnoa60rE4sPjuQ=="],
 
-    "@dcc-bs/event-system.bs.js/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
+    "@dcc-bs/audio-recorder.bs.js/dexie": ["dexie@4.2.1", "", {}, "sha512-Ckej0NS6jxQ4Po3OrSQBFddayRhTCic2DoCAG5zacOfOVB9P2Q5Xc5uL/nVa7ZVs+HdMnvUPzLFCB/JwpB6Csg=="],
 
-    "@dcc-bs/feedback-control.bs.js/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
+    "@dcc-bs/common-ui.bs.js/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
-    "@dcc-bs/logger.bs.js/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
+    "@dcc-bs/event-system.bs.js/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@dxup/nuxt/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@dxup/nuxt/chokidar": ["chokidar@5.0.0", "", { "dependencies": { "readdirp": "^5.0.0" } }, "sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw=="],
 
+    "@eslint/config-array/minimatch": ["minimatch@10.2.4", "", { "dependencies": { "brace-expansion": "^5.0.2" } }, "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg=="],
+
     "@intlify/bundle-utils/esbuild": ["esbuild@0.25.12", "", { "optionalDependencies": { "@esbuild/aix-ppc64": "0.25.12", "@esbuild/android-arm": "0.25.12", "@esbuild/android-arm64": "0.25.12", "@esbuild/android-x64": "0.25.12", "@esbuild/darwin-arm64": "0.25.12", "@esbuild/darwin-x64": "0.25.12", "@esbuild/freebsd-arm64": "0.25.12", "@esbuild/freebsd-x64": "0.25.12", "@esbuild/linux-arm": "0.25.12", "@esbuild/linux-arm64": "0.25.12", "@esbuild/linux-ia32": "0.25.12", "@esbuild/linux-loong64": "0.25.12", "@esbuild/linux-mips64el": "0.25.12", "@esbuild/linux-ppc64": "0.25.12", "@esbuild/linux-riscv64": "0.25.12", "@esbuild/linux-s390x": "0.25.12", "@esbuild/linux-x64": "0.25.12", "@esbuild/netbsd-arm64": "0.25.12", "@esbuild/netbsd-x64": "0.25.12", "@esbuild/openbsd-arm64": "0.25.12", "@esbuild/openbsd-x64": "0.25.12", "@esbuild/openharmony-arm64": "0.25.12", "@esbuild/sunos-x64": "0.25.12", "@esbuild/win32-arm64": "0.25.12", "@esbuild/win32-ia32": "0.25.12", "@esbuild/win32-x64": "0.25.12" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg=="],
 
+    "@intlify/bundle-utils/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+
     "@intlify/unplugin-vue-i18n/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
     "@intlify/vue-i18n-extensions/@intlify/shared": ["@intlify/shared@10.0.8", "", {}, "sha512-BcmHpb5bQyeVNrptC3UhzpBZB/YHHDoEREOUERrmF2BRxsyOEuRrq+Z96C/D4+2KJb8kuHiouzAei7BXlG0YYw=="],
 
     "@intlify/vue-i18n-extensions/vue-i18n": ["vue-i18n@10.0.8", "", { "dependencies": { "@intlify/core-base": "10.0.8", "@intlify/shared": "10.0.8", "@vue/devtools-api": "^6.5.0" }, "peerDependencies": { "vue": "^3.0.0" } }, "sha512-mIjy4utxMz9lMMo6G9vYePv7gUFt4ztOMhY9/4czDJxZ26xPeJ49MAGa9wBAE3XuXbYCrtVPmPxNjej7JJJkZQ=="],
 
+    "@isaacs/cliui/string-width": ["string-width@5.1.2", "", { "dependencies": { "eastasianwidth": "^0.2.0", "emoji-regex": "^9.2.2", "strip-ansi": "^7.0.1" } }, "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA=="],
+
+    "@isaacs/cliui/strip-ansi": ["strip-ansi@7.2.0", "", { "dependencies": { "ansi-regex": "^6.2.2" } }, "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w=="],
+
+    "@isaacs/cliui/wrap-ansi": ["wrap-ansi@8.1.0", "", { "dependencies": { "ansi-styles": "^6.1.0", "string-width": "^5.0.1", "strip-ansi": "^7.0.1" } }, "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ=="],
+
+    "@mapbox/node-pre-gyp/nopt": ["nopt@8.1.0", "", { "dependencies": { "abbrev": "^3.0.0" }, "bin": { "nopt": "bin/nopt.js" } }, "sha512-ieGu42u/Qsa4TFktmaKEwM6MQH0pOWnaB3htzh0JRtx84+Mebc0cbZYN5bC+6WTZ4+77xrL9Pn5m7CV6VIkV7A=="],
+
+    "@nuxt/cli/@clack/prompts": ["@clack/prompts@1.0.1", "", { "dependencies": { "@clack/core": "1.0.1", "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-/42G73JkuYdyWZ6m8d/CJtBrGl1Hegyc7Fy78m5Ob+jF85TOUmLR5XLce/U3LxYAw0kJ8CT5aI99RIvPHcGp/Q=="],
+
+    "@nuxt/cli/giget": ["giget@3.1.2", "", { "bin": { "giget": "dist/cli.mjs" } }, "sha512-T2qUpKBHeUTwHcIhydgnJzhL0Hj785ms+JkxaaWQH9SDM/llXeewnOkfJcFShAHjWI+26hOChwUfCoupaXLm8g=="],
+
+    "@nuxt/cli/srvx": ["srvx@0.11.8", "", { "bin": { "srvx": "bin/srvx.mjs" } }, "sha512-2n9t0YnAXPJjinytvxccNgs7rOA5gmE7Wowt/8Dy2dx2fDC6sBhfBpbrCvjYKALlVukPS/Uq3QwkolKNa7P/2Q=="],
+
+    "@nuxt/devtools/@nuxt/devtools-kit": ["@nuxt/devtools-kit@3.2.2", "", { "dependencies": { "@nuxt/kit": "^4.3.1", "execa": "^8.0.1" }, "peerDependencies": { "vite": ">=6.0" } }, "sha512-07E1phqoVPNlexlkrYuOMPhTzLIRjcl9iEqyc/vZLH2zWeH/T1X3v+RLTVW5Oio40f/XBp9yQuyihmX34ddjgQ=="],
+
     "@nuxt/devtools/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@nuxt/devtools/hookable": ["hookable@6.0.1", "", {}, "sha512-uKGyY8BuzN/a5gvzvA+3FVWo0+wUjgtfSdnmjtrOVwQCZPHpHDH2WRO3VZSOeluYrHoDCiXFffZXs8Dj1ULWtw=="],
 
-    "@nuxt/devtools-kit/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
+    "@nuxt/devtools-wizard/@clack/prompts": ["@clack/prompts@1.0.1", "", { "dependencies": { "@clack/core": "1.0.1", "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-/42G73JkuYdyWZ6m8d/CJtBrGl1Hegyc7Fy78m5Ob+jF85TOUmLR5XLce/U3LxYAw0kJ8CT5aI99RIvPHcGp/Q=="],
+
+    "@nuxt/fonts/@nuxt/devtools-kit": ["@nuxt/devtools-kit@3.2.2", "", { "dependencies": { "@nuxt/kit": "^4.3.1", "execa": "^8.0.1" }, "peerDependencies": { "vite": ">=6.0" } }, "sha512-07E1phqoVPNlexlkrYuOMPhTzLIRjcl9iEqyc/vZLH2zWeH/T1X3v+RLTVW5Oio40f/XBp9yQuyihmX34ddjgQ=="],
 
     "@nuxt/fonts/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
+    "@nuxt/icon/@nuxt/devtools-kit": ["@nuxt/devtools-kit@3.2.2", "", { "dependencies": { "@nuxt/kit": "^4.3.1", "execa": "^8.0.1" }, "peerDependencies": { "vite": ">=6.0" } }, "sha512-07E1phqoVPNlexlkrYuOMPhTzLIRjcl9iEqyc/vZLH2zWeH/T1X3v+RLTVW5Oio40f/XBp9yQuyihmX34ddjgQ=="],
+
     "@nuxt/icon/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@nuxt/nitro-server/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@nuxt/telemetry/ofetch": ["ofetch@2.0.0-alpha.3", "", {}, "sha512-zpYTCs2byOuft65vI3z43Dd6iSdFbOZZLb9/d21aCpx2rGastVU9dOCv0lu4ykc1Ur1anAYjDi3SUvR0vq50JA=="],
 
-    "@nuxt/telemetry/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
     "@nuxt/ui/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
-    "@nuxt/vite-builder/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
+    "@nuxt/ui/motion-v": ["motion-v@1.10.3", "", { "dependencies": { "framer-motion": "^12.25.0", "hey-listen": "^1.0.8", "motion-dom": "^12.23.23" }, "peerDependencies": { "@vueuse/core": ">=10.0.0", "vue": ">=3.0.0" } }, "sha512-9Ewo/wwGv7FO3PqYJpllBF/Efc7tbeM1iinVrM73s0RUQrnXHwMZCaRX98u4lu0PQCrZghPPfCsQ14pWKIEbnQ=="],
 
-    "@nuxtjs/color-mode/@nuxt/kit": ["@nuxt/kit@3.21.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "knitwork": "^1.3.0", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-QORZRjcuTKgo++XP1Pc2c2gqwRydkaExrIRfRI9vFsPA3AzuHVn5Gfmbv1ic8y34e78mr5DMBvJlelUaeOuajg=="],
+    "@nuxt/ui/vue-component-type-helpers": ["vue-component-type-helpers@3.2.5", "", {}, "sha512-tkvNr+bU8+xD/onAThIe7CHFvOJ/BO6XCOrxMzeytJq40nTfpGDJuVjyCM8ccGZKfAbGk2YfuZyDMXM56qheZQ=="],
+
+    "@nuxt/vite-builder/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@nuxtjs/color-mode/pathe": ["pathe@1.1.2", "", {}, "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ=="],
 
@@ -2733,16 +2928,22 @@
 
     "@parcel/watcher-wasm/napi-wasm": ["napi-wasm@1.1.3", "", { "bundled": true }, "sha512-h/4nMGsHjZDCYmQVNODIrYACVJ+I9KItbG+0si6W/jSjdA9JbWDoU4LLeMXVcEQGHjttI2tuXqDrbGF7qkUHHg=="],
 
-    "@pinia/nuxt/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
-
     "@poppinss/dumper/@sindresorhus/is": ["@sindresorhus/is@7.2.0", "", {}, "sha512-P1Cz1dWaFfR4IR+U13mqqiGsLFf1KbayybWwdd2vfctdV6hDpUkgCY0nKOLLTMSoRd/jJNjtbqzf13K8DCCXQw=="],
 
+    "@poppinss/dumper/supports-color": ["supports-color@10.2.2", "", {}, "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g=="],
+
     "@rollup/plugin-babel/@rollup/pluginutils": ["@rollup/pluginutils@3.1.0", "", { "dependencies": { "@types/estree": "0.0.39", "estree-walker": "^1.0.1", "picomatch": "^2.2.2" }, "peerDependencies": { "rollup": "^1.20.0||^2.0.0" } }, "sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg=="],
 
     "@rollup/plugin-babel/rollup": ["rollup@2.80.0", "", { "optionalDependencies": { "fsevents": "~2.3.2" }, "bin": { "rollup": "dist/bin/rollup" } }, "sha512-cIFJOD1DESzpjOBl763Kp1AH7UE/0fcdHe6rZXUdQ9c50uvgigvW97u3IcSeBwOkgqL/PXPBktBCh0KEu5L8XQ=="],
 
+    "@rollup/plugin-commonjs/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+
+    "@rollup/plugin-inject/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+
     "@rollup/plugin-yaml/js-yaml": ["js-yaml@4.1.1", "", { "dependencies": { "argparse": "^2.0.1" }, "bin": { "js-yaml": "bin/js-yaml.js" } }, "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA=="],
 
+    "@rollup/pluginutils/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+
     "@surma/rollup-plugin-off-main-thread/magic-string": ["magic-string@0.25.9", "", { "dependencies": { "sourcemap-codec": "^1.4.8" } }, "sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ=="],
 
     "@tailwindcss/oxide-wasm32-wasi/@emnapi/core": ["@emnapi/core@1.8.1", "", { "dependencies": { "@emnapi/wasi-threads": "1.1.0", "tslib": "^2.4.0" }, "bundled": true }, "sha512-AvT9QFpxK0Zd8J0jopedNm+w/2fIzvtPKPjqyw9jwvBaReTTqPBk9Hixaz7KbjimP+QNz605/XnjFcDAL2pqBg=="],
@@ -2757,19 +2958,23 @@
 
     "@tailwindcss/oxide-wasm32-wasi/tslib": ["tslib@2.8.1", "", { "bundled": true }, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
 
+    "@typescript-eslint/typescript-estree/minimatch": ["minimatch@10.2.4", "", { "dependencies": { "brace-expansion": "^5.0.2" } }, "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg=="],
+
     "@typescript-eslint/visitor-keys/eslint-visitor-keys": ["eslint-visitor-keys@5.0.1", "", {}, "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA=="],
 
     "@unhead/vue/hookable": ["hookable@6.0.1", "", {}, "sha512-uKGyY8BuzN/a5gvzvA+3FVWo0+wUjgtfSdnmjtrOVwQCZPHpHDH2WRO3VZSOeluYrHoDCiXFffZXs8Dj1ULWtw=="],
 
-    "@vercel/nft/glob": ["glob@13.0.6", "", { "dependencies": { "minimatch": "^10.2.2", "minipass": "^7.1.3", "path-scurry": "^2.0.2" } }, "sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw=="],
+    "@vercel/nft/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
 
-    "@vite-pwa/nuxt/@nuxt/kit": ["@nuxt/kit@3.21.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "knitwork": "^1.3.0", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-QORZRjcuTKgo++XP1Pc2c2gqwRydkaExrIRfRI9vFsPA3AzuHVn5Gfmbv1ic8y34e78mr5DMBvJlelUaeOuajg=="],
+    "@vercel/nft/glob": ["glob@13.0.6", "", { "dependencies": { "minimatch": "^10.2.2", "minipass": "^7.1.3", "path-scurry": "^2.0.2" } }, "sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw=="],
 
     "@vite-pwa/nuxt/pathe": ["pathe@1.1.2", "", {}, "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ=="],
 
     "@vitejs/plugin-vue-jsx/@rolldown/pluginutils": ["@rolldown/pluginutils@1.0.0-rc.6", "", {}, "sha512-Y0+JT8Mi1mmW08K6HieG315XNRu4L0rkfCpA364HtytjgiqYnMYRdFPcxRl+BQQqNXzecL2S9nii+RUpO93XIA=="],
 
-    "@vue/compiler-core/entities": ["entities@7.0.1", "", {}, "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA=="],
+    "@vue/compiler-core/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+
+    "@vue/compiler-sfc/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
 
     "@vue/devtools-kit/birpc": ["birpc@2.9.0", "", {}, "sha512-KrayHS5pBi69Xi9JmvoqrIgYGDkD6mcSe/i6YKi3w5kekCLzrX4+nawcXqrj2tIp50Kw/mT/s3p+GVK0A0sKxw=="],
 
@@ -2777,7 +2982,7 @@
 
     "archiver/readable-stream": ["readable-stream@4.7.0", "", { "dependencies": { "abort-controller": "^3.0.0", "buffer": "^6.0.3", "events": "^3.3.0", "process": "^0.11.10", "string_decoder": "^1.3.0" } }, "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg=="],
 
-    "archiver-utils/glob": ["glob@10.5.0", "", { "dependencies": { "foreground-child": "^3.1.0", "jackspeak": "^3.1.2", "minimatch": "^9.0.4", "minipass": "^7.1.2", "package-json-from-dist": "^1.0.0", "path-scurry": "^1.11.1" }, "bin": { "glob": "dist/esm/bin.mjs" } }, "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg=="],
+    "archiver-utils/is-stream": ["is-stream@2.0.1", "", {}, "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg=="],
 
     "archiver-utils/readable-stream": ["readable-stream@4.7.0", "", { "dependencies": { "abort-controller": "^3.0.0", "buffer": "^6.0.3", "events": "^3.3.0", "process": "^0.11.10", "string_decoder": "^1.3.0" } }, "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg=="],
 
@@ -2785,7 +2990,11 @@
 
     "c12/chokidar": ["chokidar@5.0.0", "", { "dependencies": { "readdirp": "^5.0.0" } }, "sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw=="],
 
-    "c12/giget": ["giget@2.0.0", "", { "dependencies": { "citty": "^0.1.6", "consola": "^3.4.0", "defu": "^6.1.4", "node-fetch-native": "^1.6.6", "nypm": "^0.6.0", "pathe": "^2.0.3" }, "bin": { "giget": "dist/cli.mjs" } }, "sha512-L5bGsVkxJbJgdnwyuheIunkGatUF/zssUoxxjACCseZYAVbaqdh9Tsmmlkl8vYan09H7sbvKt4pS8GqKLBrEzA=="],
+    "c12/rc9": ["rc9@2.1.2", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.3" } }, "sha512-btXCnMmRIBINM2LDZoEmOogIZU7Qe7zn4BpomSKZ/ykbLObuBdvG+mFq11DL6fjH1DRwHhrlgtYWG96bJiC7Cg=="],
+
+    "cliui/wrap-ansi": ["wrap-ansi@7.0.0", "", { "dependencies": { "ansi-styles": "^4.0.0", "string-width": "^4.1.0", "strip-ansi": "^6.0.0" } }, "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q=="],
+
+    "compress-commons/is-stream": ["is-stream@2.0.1", "", {}, "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg=="],
 
     "compress-commons/readable-stream": ["readable-stream@4.7.0", "", { "dependencies": { "abort-controller": "^3.0.0", "buffer": "^6.0.3", "events": "^3.3.0", "process": "^0.11.10", "string_decoder": "^1.3.0" } }, "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg=="],
 
@@ -2795,7 +3004,7 @@
 
     "csso/css-tree": ["css-tree@2.2.1", "", { "dependencies": { "mdn-data": "2.0.28", "source-map-js": "^1.0.1" } }, "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA=="],
 
-    "dot-prop/type-fest": ["type-fest@5.4.4", "", { "dependencies": { "tagged-tag": "^1.0.0" } }, "sha512-JnTrzGu+zPV3aXIUhnyWJj4z/wigMsdYajGLIYakqyOW1nPllzXEJee0QQbHj+CTIQtXGlAjuK0UY+2xTyjVAw=="],
+    "dom-serializer/entities": ["entities@4.5.0", "", {}, "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw=="],
 
     "escodegen/source-map": ["source-map@0.6.1", "", {}, "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="],
 
@@ -2809,14 +3018,18 @@
 
     "eslint/ignore": ["ignore@5.3.2", "", {}, "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g=="],
 
-    "espree/eslint-visitor-keys": ["eslint-visitor-keys@5.0.1", "", {}, "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA=="],
+    "eslint/minimatch": ["minimatch@10.2.4", "", { "dependencies": { "brace-expansion": "^5.0.2" } }, "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg=="],
 
-    "execa/is-stream": ["is-stream@3.0.0", "", {}, "sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA=="],
+    "espree/eslint-visitor-keys": ["eslint-visitor-keys@5.0.1", "", {}, "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA=="],
 
     "filelist/minimatch": ["minimatch@5.1.9", "", { "dependencies": { "brace-expansion": "^2.0.1" } }, "sha512-7o1wEA2RyMP7Iu7GNba9vc0RWWGACJOCZBJX2GJWip0ikV+wcOsgVuY9uE8CPiyQhkGFSlhuSkZPavN7u1c2Fw=="],
 
     "fontaine/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
+    "giget/citty": ["citty@0.1.6", "", { "dependencies": { "consola": "^3.2.3" } }, "sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ=="],
+
+    "global-directory/ini": ["ini@4.1.1", "", {}, "sha512-QQnnxNyfvmHFIsj7gkPcYymR8Jdw/o7mp5ZFihxn6h8Ci6fh3Dx4E1gPjpQEpIuPo9XVNY/ZUwh4BPMjGyL01g=="],
+
     "h3/cookie-es": ["cookie-es@1.2.2", "", {}, "sha512-+W7VmiVINB+ywl1HGXJXmrqkOhpKrIiVZV6tQuV54ZyQC7MMuBt81Vc336GMLoHBq5hV/F9eXgt5Mnx0Rha5Fg=="],
 
     "hast-util-raw/parse5": ["parse5@7.3.0", "", { "dependencies": { "entities": "^6.0.0" } }, "sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw=="],
@@ -2829,16 +3042,14 @@
 
     "jsonc-eslint-parser/espree": ["espree@9.6.1", "", { "dependencies": { "acorn": "^8.9.0", "acorn-jsx": "^5.3.2", "eslint-visitor-keys": "^3.4.1" } }, "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ=="],
 
-    "lazystream/readable-stream": ["readable-stream@2.3.8", "", { "dependencies": { "core-util-is": "~1.0.0", "inherits": "~2.0.3", "isarray": "~1.0.0", "process-nextick-args": "~2.0.0", "safe-buffer": "~5.1.1", "string_decoder": "~1.1.1", "util-deprecate": "~1.0.1" } }, "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA=="],
-
     "listhen/citty": ["citty@0.1.6", "", { "dependencies": { "consola": "^3.2.3" } }, "sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ=="],
 
     "listhen/pathe": ["pathe@1.1.2", "", {}, "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ=="],
 
-    "magic-regexp/estree-walker": ["estree-walker@3.0.3", "", { "dependencies": { "@types/estree": "^1.0.0" } }, "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g=="],
-
     "magic-regexp/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
+    "markdown-it/entities": ["entities@4.5.0", "", {}, "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw=="],
+
     "micromatch/picomatch": ["picomatch@2.3.1", "", {}, "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA=="],
 
     "mlly/pkg-types": ["pkg-types@1.3.1", "", { "dependencies": { "confbox": "^0.1.8", "mlly": "^1.7.4", "pathe": "^2.0.1" } }, "sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ=="],
@@ -2873,7 +3084,9 @@
 
     "parse5/entities": ["entities@6.0.1", "", {}, "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g=="],
 
-    "pinia/@vue/devtools-api": ["@vue/devtools-api@7.7.9", "", { "dependencies": { "@vue/devtools-kit": "^7.7.9" } }, "sha512-kIE8wvwlcZ6TJTbNeU2HQNtaxLx3a84aotTITUuL/4bzfPxzajGBOoqjMhwZJ8L9qFYDU/lAYMEEm11dnZOD6g=="],
+    "path-scurry/lru-cache": ["lru-cache@10.4.3", "", {}, "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ=="],
+
+    "postcss/nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="],
 
     "prosemirror-trailing-node/escape-string-regexp": ["escape-string-regexp@4.0.0", "", {}, "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA=="],
 
@@ -2881,26 +3094,30 @@
 
     "rollup-plugin-visualizer/source-map": ["source-map@0.7.6", "", {}, "sha512-i5uvt8C3ikiWeNZSVZNWcfZPItFQOsYTUAOkcUPGd8DqDy1uOUikjt5dG+uRlwyvR108Fb9DOd4GvXfT0N2/uQ=="],
 
-    "source-map-support/source-map": ["source-map@0.6.1", "", {}, "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="],
+    "rollup-plugin-visualizer/yargs": ["yargs@18.0.0", "", { "dependencies": { "cliui": "^9.0.1", "escalade": "^3.1.1", "get-caller-file": "^2.0.5", "string-width": "^7.2.0", "y18n": "^5.0.5", "yargs-parser": "^22.0.0" } }, "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg=="],
 
-    "string-width-cjs/emoji-regex": ["emoji-regex@8.0.0", "", {}, "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="],
+    "safe-array-concat/isarray": ["isarray@2.0.5", "", {}, "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="],
 
-    "string-width-cjs/strip-ansi": ["strip-ansi@6.0.1", "", { "dependencies": { "ansi-regex": "^5.0.1" } }, "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A=="],
+    "safe-push-apply/isarray": ["isarray@2.0.5", "", {}, "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="],
 
-    "strip-ansi-cjs/ansi-regex": ["ansi-regex@5.0.1", "", {}, "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="],
+    "source-map-support/source-map": ["source-map@0.6.1", "", {}, "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="],
+
+    "strip-literal/js-tokens": ["js-tokens@9.0.1", "", {}, "sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ=="],
 
     "svgo/commander": ["commander@11.1.0", "", {}, "sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ=="],
 
     "tar/yallist": ["yallist@5.0.0", "", {}, "sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw=="],
 
-    "unctx/estree-walker": ["estree-walker@3.0.3", "", { "dependencies": { "@types/estree": "^1.0.0" } }, "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g=="],
+    "tempy/is-stream": ["is-stream@2.0.1", "", {}, "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg=="],
+
+    "tempy/type-fest": ["type-fest@0.16.0", "", {}, "sha512-eaBzG6MxNzEn9kiwvtre90cXaNLkmadMWa1zQMs3XORCXNbsH/OewwbxC5ia9dCxIxnTAsSxXJaa/p5y8DlvJg=="],
+
+    "terser/commander": ["commander@2.20.3", "", {}, "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="],
 
     "unctx/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
     "unhead/hookable": ["hookable@6.0.1", "", {}, "sha512-uKGyY8BuzN/a5gvzvA+3FVWo0+wUjgtfSdnmjtrOVwQCZPHpHDH2WRO3VZSOeluYrHoDCiXFffZXs8Dj1ULWtw=="],
 
-    "unimport/estree-walker": ["estree-walker@3.0.3", "", { "dependencies": { "@types/estree": "^1.0.0" } }, "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g=="],
-
     "unimport/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
     "unplugin-auto-import/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
@@ -2921,40 +3138,36 @@
 
     "vaul-vue/@vueuse/core": ["@vueuse/core@10.11.1", "", { "dependencies": { "@types/web-bluetooth": "^0.0.20", "@vueuse/metadata": "10.11.1", "@vueuse/shared": "10.11.1", "vue-demi": ">=0.14.8" } }, "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww=="],
 
+    "vaul-vue/reka-ui": ["reka-ui@2.7.0", "", { "dependencies": { "@floating-ui/dom": "^1.6.13", "@floating-ui/vue": "^1.1.6", "@internationalized/date": "^3.5.0", "@internationalized/number": "^3.5.0", "@tanstack/vue-virtual": "^3.12.0", "@vueuse/core": "^12.5.0", "@vueuse/shared": "^12.5.0", "aria-hidden": "^1.2.4", "defu": "^6.1.4", "ohash": "^2.0.11" }, "peerDependencies": { "vue": ">= 3.2.0" } }, "sha512-m+XmxQN2xtFzBP3OAdIafKq7C8OETo2fqfxcIIxYmNN2Ch3r5oAf6yEYCIJg5tL/yJU2mHqF70dCCekUkrAnXA=="],
+
     "vite-dev-rpc/birpc": ["birpc@2.9.0", "", {}, "sha512-KrayHS5pBi69Xi9JmvoqrIgYGDkD6mcSe/i6YKi3w5kekCLzrX4+nawcXqrj2tIp50Kw/mT/s3p+GVK0A0sKxw=="],
 
+    "vite-node/es-module-lexer": ["es-module-lexer@2.0.0", "", {}, "sha512-5POEcUuZybH7IdmGsD8wlf0AI55wMecM9rVBTI/qEAy2c1kTOm3DjFYjrBdI2K3BaJjJYfYFeRtM0t9ssnRuxw=="],
+
     "vite-plugin-checker/npm-run-path": ["npm-run-path@6.0.0", "", { "dependencies": { "path-key": "^4.0.0", "unicorn-magic": "^0.3.0" } }, "sha512-9qny7Z9DsQU8Ou39ERsPU4OZQlSTP47ShQzuKZ6PRXpYLtIFgl/DEBYEXKlvcEa+9tHVcK8CF81Y2V72qaZhWA=="],
 
-    "vite-plugin-vue-tracer/estree-walker": ["estree-walker@3.0.3", "", { "dependencies": { "@types/estree": "^1.0.0" } }, "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g=="],
+    "which-builtin-type/isarray": ["isarray@2.0.5", "", {}, "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="],
 
     "workbox-build/@rollup/plugin-replace": ["@rollup/plugin-replace@2.4.2", "", { "dependencies": { "@rollup/pluginutils": "^3.1.0", "magic-string": "^0.25.7" }, "peerDependencies": { "rollup": "^1.20.0 || ^2.0.0" } }, "sha512-IGcu+cydlUMZ5En85jxHH4qj2hta/11BHq95iHEyb2sbgiN0eCdzvUcHw5gt9pBL5lTi4JDYJ1acCoMGpTvEZg=="],
 
+    "workbox-build/glob": ["glob@11.1.0", "", { "dependencies": { "foreground-child": "^3.3.1", "jackspeak": "^4.1.1", "minimatch": "^10.1.1", "minipass": "^7.1.2", "package-json-from-dist": "^1.0.0", "path-scurry": "^2.0.0" }, "bin": { "glob": "dist/esm/bin.mjs" } }, "sha512-vuNwKSaKiqm7g0THUBu2x7ckSs3XJLXE+2ssL7/MfTGPLLcrJQ/4Uq1CjPTtO5cCIiRxqvN6Twy1qOwhL0Xjcw=="],
+
     "workbox-build/pretty-bytes": ["pretty-bytes@5.6.0", "", {}, "sha512-FFw039TmrBqFK8ma/7OL3sDz/VytdtJr044/QUJtH0wK9lb9jLq9tJyIxUwtQJHwar2BqtiA4iCWSwo9JLkzFg=="],
 
     "workbox-build/rollup": ["rollup@2.80.0", "", { "optionalDependencies": { "fsevents": "~2.3.2" }, "bin": { "rollup": "dist/bin/rollup" } }, "sha512-cIFJOD1DESzpjOBl763Kp1AH7UE/0fcdHe6rZXUdQ9c50uvgigvW97u3IcSeBwOkgqL/PXPBktBCh0KEu5L8XQ=="],
 
-    "wrap-ansi-cjs/ansi-styles": ["ansi-styles@4.3.0", "", { "dependencies": { "color-convert": "^2.0.1" } }, "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg=="],
-
-    "wrap-ansi-cjs/string-width": ["string-width@4.2.3", "", { "dependencies": { "emoji-regex": "^8.0.0", "is-fullwidth-code-point": "^3.0.0", "strip-ansi": "^6.0.1" } }, "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g=="],
-
-    "wrap-ansi-cjs/strip-ansi": ["strip-ansi@6.0.1", "", { "dependencies": { "ansi-regex": "^5.0.1" } }, "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A=="],
-
     "zip-stream/readable-stream": ["readable-stream@4.7.0", "", { "dependencies": { "abort-controller": "^3.0.0", "buffer": "^6.0.3", "events": "^3.3.0", "process": "^0.11.10", "string_decoder": "^1.3.0" } }, "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg=="],
 
+    "@dcc-bs/audio-recorder.bs.js/@nuxt/kit/rc9": ["rc9@2.1.2", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.3" } }, "sha512-btXCnMmRIBINM2LDZoEmOogIZU7Qe7zn4BpomSKZ/ykbLObuBdvG+mFq11DL6fjH1DRwHhrlgtYWG96bJiC7Cg=="],
+
     "@dcc-bs/audio-recorder.bs.js/@nuxtjs/i18n/@nuxt/kit": ["@nuxt/kit@4.3.1", "", { "dependencies": { "c12": "^3.3.3", "consola": "^3.4.2", "defu": "^6.1.4", "destr": "^2.0.5", "errx": "^0.1.0", "exsolve": "^1.0.8", "ignore": "^7.0.5", "jiti": "^2.6.1", "klona": "^2.0.6", "mlly": "^1.8.0", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.3.0", "rc9": "^3.0.0", "scule": "^1.3.0", "semver": "^7.7.4", "tinyglobby": "^0.2.15", "ufo": "^1.6.3", "unctx": "^2.5.0", "untyped": "^2.0.0" } }, "sha512-UjBFt72dnpc+83BV3OIbCT0YHLevJtgJCHpxMX0YRKWLDhhbcDdUse87GtsQBrjvOzK7WUNUYLDS/hQLYev5rA=="],
 
     "@dcc-bs/audio-recorder.bs.js/@nuxtjs/i18n/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
-    "@dcc-bs/event-system.bs.js/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@dcc-bs/feedback-control.bs.js/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@dcc-bs/logger.bs.js/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@dxup/nuxt/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
     "@dxup/nuxt/chokidar/readdirp": ["readdirp@5.0.0", "", {}, "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ=="],
 
+    "@eslint/config-array/minimatch/brace-expansion": ["brace-expansion@5.0.4", "", { "dependencies": { "balanced-match": "^4.0.2" } }, "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg=="],
+
     "@intlify/bundle-utils/esbuild/@esbuild/aix-ppc64": ["@esbuild/aix-ppc64@0.25.12", "", { "os": "aix", "cpu": "ppc64" }, "sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA=="],
 
     "@intlify/bundle-utils/esbuild/@esbuild/android-arm": ["@esbuild/android-arm@0.25.12", "", { "os": "android", "cpu": "arm" }, "sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg=="],
@@ -3009,55 +3222,43 @@
 
     "@intlify/vue-i18n-extensions/vue-i18n/@intlify/core-base": ["@intlify/core-base@10.0.8", "", { "dependencies": { "@intlify/message-compiler": "10.0.8", "@intlify/shared": "10.0.8" } }, "sha512-FoHslNWSoHjdUBLy35bpm9PV/0LVI/DSv9L6Km6J2ad8r/mm0VaGg06C40FqlE8u2ADcGUM60lyoU7Myo4WNZQ=="],
 
-    "@nuxt/devtools-kit/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@nuxt/devtools/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@nuxt/fonts/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@nuxt/icon/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@nuxt/nitro-server/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
+    "@isaacs/cliui/string-width/emoji-regex": ["emoji-regex@9.2.2", "", {}, "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg=="],
 
-    "@nuxt/ui/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
+    "@isaacs/cliui/strip-ansi/ansi-regex": ["ansi-regex@6.2.2", "", {}, "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg=="],
 
-    "@nuxt/vite-builder/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
+    "@isaacs/cliui/wrap-ansi/ansi-styles": ["ansi-styles@6.2.3", "", {}, "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg=="],
 
-    "@nuxtjs/color-mode/@nuxt/kit/pathe": ["pathe@2.0.3", "", {}, "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w=="],
+    "@mapbox/node-pre-gyp/nopt/abbrev": ["abbrev@3.0.1", "", {}, "sha512-AO2ac6pjRB3SJmGJo+v5/aK6Omggp6fsLrs6wN9bd35ulu4cCwaAU9+7ZhXjeqHVkaHThLuzH0nZr0YpCDhygg=="],
 
-    "@nuxtjs/color-mode/@nuxt/kit/pkg-types": ["pkg-types@2.3.0", "", { "dependencies": { "confbox": "^0.2.2", "exsolve": "^1.0.7", "pathe": "^2.0.3" } }, "sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig=="],
+    "@nuxt/cli/@clack/prompts/@clack/core": ["@clack/core@1.0.1", "", { "dependencies": { "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-WKeyK3NOBwDOzagPR5H08rFk9D/WuN705yEbuZvKqlkmoLM2woKtXb10OO2k1NoSU4SFG947i2/SCYh+2u5e4g=="],
 
-    "@nuxtjs/color-mode/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
+    "@nuxt/devtools-wizard/@clack/prompts/@clack/core": ["@clack/core@1.0.1", "", { "dependencies": { "picocolors": "^1.0.0", "sisteransi": "^1.0.5" } }, "sha512-WKeyK3NOBwDOzagPR5H08rFk9D/WuN705yEbuZvKqlkmoLM2woKtXb10OO2k1NoSU4SFG947i2/SCYh+2u5e4g=="],
 
     "@nuxtjs/color-mode/pkg-types/confbox": ["confbox@0.1.8", "", {}, "sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w=="],
 
     "@nuxtjs/color-mode/pkg-types/pathe": ["pathe@2.0.3", "", {}, "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w=="],
 
-    "@nuxtjs/i18n/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@nuxtjs/mdc/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
-    "@pinia/nuxt/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
     "@rollup/plugin-babel/@rollup/pluginutils/@types/estree": ["@types/estree@0.0.39", "", {}, "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw=="],
 
     "@rollup/plugin-babel/@rollup/pluginutils/estree-walker": ["estree-walker@1.0.1", "", {}, "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg=="],
 
     "@rollup/plugin-babel/@rollup/pluginutils/picomatch": ["picomatch@2.3.1", "", {}, "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA=="],
 
-    "@vite-pwa/nuxt/@nuxt/kit/pathe": ["pathe@2.0.3", "", {}, "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w=="],
+    "@typescript-eslint/typescript-estree/minimatch/brace-expansion": ["brace-expansion@5.0.4", "", { "dependencies": { "balanced-match": "^4.0.2" } }, "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg=="],
 
-    "@vite-pwa/nuxt/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
+    "@vercel/nft/glob/minimatch": ["minimatch@10.2.4", "", { "dependencies": { "brace-expansion": "^5.0.2" } }, "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg=="],
 
-    "archiver-utils/glob/jackspeak": ["jackspeak@3.4.3", "", { "dependencies": { "@isaacs/cliui": "^8.0.2" }, "optionalDependencies": { "@pkgjs/parseargs": "^0.11.0" } }, "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw=="],
+    "@vercel/nft/glob/path-scurry": ["path-scurry@2.0.2", "", { "dependencies": { "lru-cache": "^11.0.0", "minipass": "^7.1.2" } }, "sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg=="],
 
-    "archiver-utils/glob/minimatch": ["minimatch@9.0.9", "", { "dependencies": { "brace-expansion": "^2.0.2" } }, "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg=="],
+    "archiver-utils/readable-stream/string_decoder": ["string_decoder@1.3.0", "", { "dependencies": { "safe-buffer": "~5.2.0" } }, "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA=="],
 
-    "archiver-utils/glob/path-scurry": ["path-scurry@1.11.1", "", { "dependencies": { "lru-cache": "^10.2.0", "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0" } }, "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA=="],
+    "archiver/readable-stream/string_decoder": ["string_decoder@1.3.0", "", { "dependencies": { "safe-buffer": "~5.2.0" } }, "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA=="],
 
     "c12/chokidar/readdirp": ["readdirp@5.0.0", "", {}, "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ=="],
 
-    "c12/giget/citty": ["citty@0.1.6", "", { "dependencies": { "consola": "^3.2.3" } }, "sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ=="],
+    "compress-commons/readable-stream/string_decoder": ["string_decoder@1.3.0", "", { "dependencies": { "safe-buffer": "~5.2.0" } }, "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA=="],
+
+    "crc32-stream/readable-stream/string_decoder": ["string_decoder@1.3.0", "", { "dependencies": { "safe-buffer": "~5.2.0" } }, "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA=="],
 
     "cross-spawn/which/isexe": ["isexe@2.0.0", "", {}, "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="],
 
@@ -3065,16 +3266,10 @@
 
     "eslint/ajv/json-schema-traverse": ["json-schema-traverse@0.4.1", "", {}, "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="],
 
-    "filelist/minimatch/brace-expansion": ["brace-expansion@2.0.2", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ=="],
+    "eslint/minimatch/brace-expansion": ["brace-expansion@5.0.4", "", { "dependencies": { "balanced-match": "^4.0.2" } }, "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg=="],
 
     "hast-util-raw/parse5/entities": ["entities@6.0.1", "", {}, "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g=="],
 
-    "lazystream/readable-stream/isarray": ["isarray@1.0.0", "", {}, "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ=="],
-
-    "lazystream/readable-stream/safe-buffer": ["safe-buffer@5.1.2", "", {}, "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="],
-
-    "lazystream/readable-stream/string_decoder": ["string_decoder@1.1.1", "", { "dependencies": { "safe-buffer": "~5.1.0" } }, "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg=="],
-
     "mlly/pkg-types/confbox": ["confbox@0.1.8", "", {}, "sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w=="],
 
     "nitropack/chokidar/readdirp": ["readdirp@5.0.0", "", {}, "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ=="],
@@ -3083,8 +3278,6 @@
 
     "node-fetch/whatwg-url/webidl-conversions": ["webidl-conversions@3.0.1", "", {}, "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="],
 
-    "nuxt/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
-
     "nuxt/chokidar/readdirp": ["readdirp@5.0.0", "", {}, "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ=="],
 
     "nuxt/oxc-parser/@oxc-parser/binding-android-arm64": ["@oxc-parser/binding-android-arm64@0.112.0", "", { "os": "android", "cpu": "arm64" }, "sha512-pRkbBRbuIIsufUWpOJ+JHWfJFNupkidy4sbjfcm37e6xwYrn9LSKMLubPHvNaL1Zf92ZRhGiwaYkEcmaFg2VcA=="],
@@ -3151,11 +3344,11 @@
 
     "nuxt/unplugin-vue-router/unplugin": ["unplugin@2.3.11", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "acorn": "^8.15.0", "picomatch": "^4.0.3", "webpack-virtual-modules": "^0.6.2" } }, "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww=="],
 
-    "pinia/@vue/devtools-api/@vue/devtools-kit": ["@vue/devtools-kit@7.7.9", "", { "dependencies": { "@vue/devtools-shared": "^7.7.9", "birpc": "^2.3.0", "hookable": "^5.5.3", "mitt": "^3.0.1", "perfect-debounce": "^1.0.0", "speakingurl": "^14.0.1", "superjson": "^2.2.2" } }, "sha512-PyQ6odHSgiDVd4hnTP+aDk2X4gl2HmLDfiyEnn3/oV+ckFDuswRs4IbBT7vacMuGdwY/XemxBoh302ctbsptuA=="],
+    "rollup-plugin-visualizer/yargs/cliui": ["cliui@9.0.1", "", { "dependencies": { "string-width": "^7.2.0", "strip-ansi": "^7.1.0", "wrap-ansi": "^9.0.0" } }, "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w=="],
 
-    "readdir-glob/minimatch/brace-expansion": ["brace-expansion@2.0.2", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ=="],
+    "rollup-plugin-visualizer/yargs/string-width": ["string-width@7.2.0", "", { "dependencies": { "emoji-regex": "^10.3.0", "get-east-asian-width": "^1.0.0", "strip-ansi": "^7.1.0" } }, "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ=="],
 
-    "string-width-cjs/strip-ansi/ansi-regex": ["ansi-regex@5.0.1", "", {}, "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="],
+    "rollup-plugin-visualizer/yargs/yargs-parser": ["yargs-parser@22.0.0", "", {}, "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw=="],
 
     "unplugin-vue-components/chokidar/readdirp": ["readdirp@5.0.0", "", {}, "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ=="],
 
@@ -3167,6 +3360,10 @@
 
     "vaul-vue/@vueuse/core/@vueuse/shared": ["@vueuse/shared@10.11.1", "", { "dependencies": { "vue-demi": ">=0.14.8" } }, "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA=="],
 
+    "vaul-vue/reka-ui/@vueuse/core": ["@vueuse/core@12.8.2", "", { "dependencies": { "@types/web-bluetooth": "^0.0.21", "@vueuse/metadata": "12.8.2", "@vueuse/shared": "12.8.2", "vue": "^3.5.13" } }, "sha512-HbvCmZdzAu3VGi/pWYm5Ut+Kd9mn1ZHnn4L5G8kOQTPs/IwIAmJoBrmYk2ckLArgMXZj0AW3n5CAejLUO+PhdQ=="],
+
+    "vaul-vue/reka-ui/@vueuse/shared": ["@vueuse/shared@12.8.2", "", { "dependencies": { "vue": "^3.5.13" } }, "sha512-dznP38YzxZoNloI0qpEfpkms8knDtaoQ6Y/sfS0L7Yki4zh40LFHEhur0odJC6xTHG5dxWVPiUWBXn+wCG2s5w=="],
+
     "vite-plugin-checker/npm-run-path/path-key": ["path-key@4.0.0", "", {}, "sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ=="],
 
     "vite-plugin-checker/npm-run-path/unicorn-magic": ["unicorn-magic@0.3.0", "", {}, "sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA=="],
@@ -3175,31 +3372,41 @@
 
     "workbox-build/@rollup/plugin-replace/magic-string": ["magic-string@0.25.9", "", { "dependencies": { "sourcemap-codec": "^1.4.8" } }, "sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ=="],
 
-    "wrap-ansi-cjs/ansi-styles/color-convert": ["color-convert@2.0.1", "", { "dependencies": { "color-name": "~1.1.4" } }, "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ=="],
+    "workbox-build/glob/jackspeak": ["jackspeak@4.2.3", "", { "dependencies": { "@isaacs/cliui": "^9.0.0" } }, "sha512-ykkVRwrYvFm1nb2AJfKKYPr0emF6IiXDYUaFx4Zn9ZuIH7MrzEZ3sD5RlqGXNRpHtvUHJyOnCEFxOlNDtGo7wg=="],
+
+    "workbox-build/glob/minimatch": ["minimatch@10.2.4", "", { "dependencies": { "brace-expansion": "^5.0.2" } }, "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg=="],
 
-    "wrap-ansi-cjs/string-width/emoji-regex": ["emoji-regex@8.0.0", "", {}, "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="],
+    "workbox-build/glob/path-scurry": ["path-scurry@2.0.2", "", { "dependencies": { "lru-cache": "^11.0.0", "minipass": "^7.1.2" } }, "sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg=="],
 
-    "wrap-ansi-cjs/strip-ansi/ansi-regex": ["ansi-regex@5.0.1", "", {}, "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="],
+    "zip-stream/readable-stream/string_decoder": ["string_decoder@1.3.0", "", { "dependencies": { "safe-buffer": "~5.2.0" } }, "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA=="],
 
-    "@dcc-bs/audio-recorder.bs.js/@nuxtjs/i18n/@nuxt/kit/rc9": ["rc9@3.0.0", "", { "dependencies": { "defu": "^6.1.4", "destr": "^2.0.5" } }, "sha512-MGOue0VqscKWQ104udASX/3GYDcKyPI4j4F8gu/jHHzglpmy9a/anZK3PNe8ug6aZFl+9GxLtdhe3kVZuMaQbA=="],
+    "@eslint/config-array/minimatch/brace-expansion/balanced-match": ["balanced-match@4.0.4", "", {}, "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA=="],
 
     "@intlify/vue-i18n-extensions/vue-i18n/@intlify/core-base/@intlify/message-compiler": ["@intlify/message-compiler@10.0.8", "", { "dependencies": { "@intlify/shared": "10.0.8", "source-map-js": "^1.0.2" } }, "sha512-DV+sYXIkHVd5yVb2mL7br/NEUwzUoLBsMkV3H0InefWgmYa34NLZUvMCGi5oWX+Hqr2Y2qUxnVrnOWF4aBlgWg=="],
 
-    "archiver-utils/glob/jackspeak/@isaacs/cliui": ["@isaacs/cliui@8.0.2", "", { "dependencies": { "string-width": "^5.1.2", "string-width-cjs": "npm:string-width@^4.2.0", "strip-ansi": "^7.0.1", "strip-ansi-cjs": "npm:strip-ansi@^6.0.1", "wrap-ansi": "^8.1.0", "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0" } }, "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA=="],
+    "@typescript-eslint/typescript-estree/minimatch/brace-expansion/balanced-match": ["balanced-match@4.0.4", "", {}, "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA=="],
+
+    "@vercel/nft/glob/minimatch/brace-expansion": ["brace-expansion@5.0.4", "", { "dependencies": { "balanced-match": "^4.0.2" } }, "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg=="],
 
-    "archiver-utils/glob/minimatch/brace-expansion": ["brace-expansion@2.0.2", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ=="],
+    "archiver-utils/readable-stream/string_decoder/safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
 
-    "archiver-utils/glob/path-scurry/lru-cache": ["lru-cache@10.4.3", "", {}, "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ=="],
+    "archiver/readable-stream/string_decoder/safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
 
-    "filelist/minimatch/brace-expansion/balanced-match": ["balanced-match@1.0.2", "", {}, "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="],
+    "compress-commons/readable-stream/string_decoder/safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
 
-    "pinia/@vue/devtools-api/@vue/devtools-kit/@vue/devtools-shared": ["@vue/devtools-shared@7.7.9", "", { "dependencies": { "rfdc": "^1.4.1" } }, "sha512-iWAb0v2WYf0QWmxCGy0seZNDPdO3Sp5+u78ORnyeonS6MT4PC7VPrryX2BpMJrwlDeaZ6BD4vP4XKjK0SZqaeA=="],
+    "crc32-stream/readable-stream/string_decoder/safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
 
-    "pinia/@vue/devtools-api/@vue/devtools-kit/birpc": ["birpc@2.9.0", "", {}, "sha512-KrayHS5pBi69Xi9JmvoqrIgYGDkD6mcSe/i6YKi3w5kekCLzrX4+nawcXqrj2tIp50Kw/mT/s3p+GVK0A0sKxw=="],
+    "eslint/minimatch/brace-expansion/balanced-match": ["balanced-match@4.0.4", "", {}, "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA=="],
 
-    "pinia/@vue/devtools-api/@vue/devtools-kit/perfect-debounce": ["perfect-debounce@1.0.0", "", {}, "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA=="],
+    "rollup-plugin-visualizer/yargs/cliui/strip-ansi": ["strip-ansi@7.2.0", "", { "dependencies": { "ansi-regex": "^6.2.2" } }, "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w=="],
 
-    "readdir-glob/minimatch/brace-expansion/balanced-match": ["balanced-match@1.0.2", "", {}, "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="],
+    "rollup-plugin-visualizer/yargs/cliui/wrap-ansi": ["wrap-ansi@9.0.2", "", { "dependencies": { "ansi-styles": "^6.2.1", "string-width": "^7.0.0", "strip-ansi": "^7.1.0" } }, "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww=="],
+
+    "rollup-plugin-visualizer/yargs/string-width/emoji-regex": ["emoji-regex@10.6.0", "", {}, "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A=="],
+
+    "rollup-plugin-visualizer/yargs/string-width/strip-ansi": ["strip-ansi@7.2.0", "", { "dependencies": { "ansi-regex": "^6.2.2" } }, "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w=="],
+
+    "vaul-vue/reka-ui/@vueuse/core/@vueuse/metadata": ["@vueuse/metadata@12.8.2", "", {}, "sha512-rAyLGEuoBJ/Il5AmFHiziCPdQzRt88VxR+Y/A/QhJ1EWtWqPBBAxTAFaSkviwEuOEZNtW8pvkPgoCZQ+HxqW1A=="],
 
     "workbox-build/@rollup/plugin-replace/@rollup/pluginutils/@types/estree": ["@types/estree@0.0.39", "", {}, "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw=="],
 
@@ -3207,14 +3414,20 @@
 
     "workbox-build/@rollup/plugin-replace/@rollup/pluginutils/picomatch": ["picomatch@2.3.1", "", {}, "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA=="],
 
-    "wrap-ansi-cjs/ansi-styles/color-convert/color-name": ["color-name@1.1.4", "", {}, "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="],
+    "workbox-build/glob/jackspeak/@isaacs/cliui": ["@isaacs/cliui@9.0.0", "", {}, "sha512-AokJm4tuBHillT+FpMtxQ60n8ObyXBatq7jD2/JA9dxbDDokKQm8KMht5ibGzLVU9IJDIKK4TPKgMHEYMn3lMg=="],
+
+    "workbox-build/glob/minimatch/brace-expansion": ["brace-expansion@5.0.4", "", { "dependencies": { "balanced-match": "^4.0.2" } }, "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg=="],
+
+    "zip-stream/readable-stream/string_decoder/safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
+
+    "@vercel/nft/glob/minimatch/brace-expansion/balanced-match": ["balanced-match@4.0.4", "", {}, "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA=="],
 
-    "archiver-utils/glob/jackspeak/@isaacs/cliui/string-width": ["string-width@5.1.2", "", { "dependencies": { "eastasianwidth": "^0.2.0", "emoji-regex": "^9.2.2", "strip-ansi": "^7.0.1" } }, "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA=="],
+    "rollup-plugin-visualizer/yargs/cliui/strip-ansi/ansi-regex": ["ansi-regex@6.2.2", "", {}, "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg=="],
 
-    "archiver-utils/glob/jackspeak/@isaacs/cliui/wrap-ansi": ["wrap-ansi@8.1.0", "", { "dependencies": { "ansi-styles": "^6.1.0", "string-width": "^5.0.1", "strip-ansi": "^7.0.1" } }, "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ=="],
+    "rollup-plugin-visualizer/yargs/cliui/wrap-ansi/ansi-styles": ["ansi-styles@6.2.3", "", {}, "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg=="],
 
-    "archiver-utils/glob/minimatch/brace-expansion/balanced-match": ["balanced-match@1.0.2", "", {}, "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="],
+    "rollup-plugin-visualizer/yargs/string-width/strip-ansi/ansi-regex": ["ansi-regex@6.2.2", "", {}, "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg=="],
 
-    "archiver-utils/glob/jackspeak/@isaacs/cliui/string-width/emoji-regex": ["emoji-regex@9.2.2", "", {}, "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg=="],
+    "workbox-build/glob/minimatch/brace-expansion/balanced-match": ["balanced-match@4.0.4", "", {}, "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA=="],
   }
 }
diff --git a/i18n/locales/de.json b/i18n/locales/de.json
index 3abc25e..2305182 100644
--- a/i18n/locales/de.json
+++ b/i18n/locales/de.json
@@ -25,12 +25,15 @@
         "tooManyRequestsTitle": "Zu viele Anfragen",
         "tooManyRequestsDescription": "Sie haben zu viele Anfragen gestellt. Bitte warten Sie einige Minuten, bevor Sie es erneut versuchen.",
         "audioLanguage": "Audio-Sprache",
-        "audioLanguageHelp": "Welche Sprache wurde in der Audiodatei gesprochen? Wenn Sie nicht sicher sind, wählen Sie 'Automatische Erkennung'."
+        "audioLanguageHelp": "Welche Sprache wurde in der Audiodatei gesprochen? Wenn Sie nicht sicher sind, wählen Sie 'Automatische Erkennung'.",
+        "settings": "Einstellungen",
+        "configureTranscription": "Konfigurieren Sie Ihre Transkription",
+        "settingsInfo": "Diese Einstellungen helfen, die Genauigkeit der Transkription zu verbessern. Sie können beide auf automatische Erkennung lassen, wenn Sie unsicher sind."
     },
     "pages": {
         "index": {
             "title": "Transcribo",
-            "subtitle": "Transkribieren Sie Ihre Audio- und Videodateien mit KI. Es werden 96 Sprachen und Audio-Dateien bis zu 2 Stunden unterstützt.",
+            "subtitle": "Transkribieren Sie Ihre Audio- und Videodateien mit KI und erstellen Sie automatisch Protokolle daraus. Es werden 96 Sprachen und Audio-Dateien bis zu 2 Stunden unterstützt.",
             "uploadMedia": "Medien hochladen",
             "uploadDescription": "Laden Sie Ihre Audio- oder Videodateien hoch",
             "recordAudio": "Audio aufnehmen",
@@ -71,7 +74,8 @@
         "play": "Abspielen",
         "pause": "Pause",
         "addSegment": "Segment hinzufügen",
-        "downloadMedia": "Medien herunterladen"
+        "downloadMedia": "Medien herunterladen",
+        "noMedia": "Keine Mediendatei verfügbar"
     },
     "taskStatus": {
         "processing": "Verarbeite deine Anfrage...",
@@ -90,6 +94,13 @@
         "notFound": "Transkription nicht gefunden oder konnte nicht geladen werden",
         "noTranscriptionsFound": "Keine Transkriptionen gefunden",
         "untitled": "Ohne Titel",
+        "info": "Transkriptions-Info",
+        "nameLabel": "Name",
+        "namePlaceholder": "Transkriptionsname",
+        "autoScrollOn": "Auto-Scroll AN",
+        "autoScrollOff": "Auto-Scroll AUS",
+        "tab": "Transkription",
+        "timelineTab": "Zeitleiste",
         "delete": {
             "title": "Transkription löschen",
             "confirmation": "Sind Sie sicher, dass Sie diese Transkription löschen möchten?"
@@ -118,7 +129,7 @@
         "withTimestamps": "Zeitstempel hinzufügen",
         "mergeSegments": "Segmente vom selben Sprecher zusammenführen",
         "withSummary": "Meeting-Zusammenfassung hinzufügen",
-        "textOnly": "Nur Textformat",
+        "textOnly": "Nur Text- und Word-Format",
         "export": "Exportieren",
         "options": "Optionen",
         "optionsTitle": "Export-Optionen",
@@ -126,7 +137,8 @@
             "title": "Export-Formate",
             "text": "Textformat",
             "subtitle": "Untertitelformat",
-            "json": "JSON-Format"
+            "json": "JSON-Format",
+            "docx": "Word-Dokument"
         },
         "exportAsText": "Als Text exportieren",
         "exportAsSrt": "Als SRT exportieren"
@@ -139,7 +151,20 @@
         "show": "Zusammenfassung anzeigen",
         "hide": "Zusammenfassung ausblenden",
         "title": "Meeting-Zusammenfassung",
-        "error": "Fehler bei der Zusammenfassung"
+        "error": "Fehler bei der Zusammenfassung",
+        "empty": "Noch keine Zusammenfassung erstellt",
+        "export": "Zusammenfassung exportieren",
+        "selectType": "Zusammenfassungsart wählen",
+        "selectLanguage": "Ausgabesprache",
+        "autoDetect": "Automatisch erkennen",
+        "types": {
+            "kurzprotokoll": "Kurzprotokoll",
+            "kurzprotokollDesc": "Kurze Zusammenfassung der wichtigsten Punkte und Entscheidungen",
+            "ergebnisprotokoll": "Ergebnisprotokoll",
+            "ergebnisprotokollDesc": "Fokus ausschliesslich auf Ergebnisse, Entscheidungen und Aufgaben",
+            "verhandlungsprotokoll": "Verhandlungsprotokoll",
+            "verhandlungsprotokollDesc": "Detailliertes Protokoll mit Diskussionen und Begründungen"
+        }
     },
     "task": {
         "errors": {
@@ -147,7 +172,8 @@
             "failedToLoad": "Fehler beim Laden der Aufgabe",
             "transcriptionFailed": "Transkription fehlgeschlagen. Bitte versuchen Sie es erneut.",
             "failedToCreateTranscription": "Fehler beim Erstellen der Transkription aus den Ergebnissen",
-            "noResult": "Kein Transkriptionsergebnis verfügbar"
+            "noResult": "Kein Transkriptionsergebnis verfügbar",
+            "TaskNotFound": "Aufgabe nicht gefunden"
         }
     },
     "commands": {
@@ -175,9 +201,20 @@
     },
     "mode": {
         "viewer": "Betrachter",
+        "summary": "Zusammenfassung",
         "editor": "Editor",
+        "statistics": "Statistik",
         "switch": "Modus wechseln"
     },
+    "statistics": {
+        "title": "Sprecher-Statistik",
+        "description": "Sprechzeit-Verteilung nach Sprecher",
+        "noData": "Keine Sprecherdaten verfügbar",
+        "audioDuration": "Audiodauer",
+        "speakingTime": "Sprechzeit",
+        "speakingPercentage": "Sprachanteil",
+        "bySpeaker": "Nach Sprecher"
+    },
     "help": {
         "help": "Hilfe",
         "title": "Hilfe - Transcribo",
@@ -253,7 +290,10 @@
         "showAbandonedRecordings": "Abgebrochene Aufnahmen anzeigen"
     },
     "languages": {
+        "autoDetect": "Automatisch erkennen",
         "de": "Deutsch",
+        "en-us": "Englisch (US)",
+        "en-gb": "Englisch (UK)",
         "en": "Englisch",
         "fr": "Französisch",
         "it": "Italienisch",
@@ -357,5 +397,84 @@
     "retention": {
         "title": "Verfügbarkeit der Transkriptionen",
         "description": "Transkriptionen älter als {retentionDays} Tage werden automatisch gelöscht."
+    },
+    "onboarding": {
+        "help": "Hilfe-Tour anzeigen",
+        "next": "Weiter",
+        "previous": "Zurück",
+        "done": "Fertig",
+        "progress": "{'{{current}}'} von {'{{total}}'}",
+        "welcome": {
+            "title": "Willkommen bei Transcribo!",
+            "description": "Transcribo ist ein KI-basierter Transkriptionsdienst, der Dir hilft, Audio- und Videodateien zu transkribieren. Alle Daten werden auf lokalen Servern der IT BS verarbeitet. Du kannst mit Transcribo auch besondere Personendaten und Daten, die dem Amtsgeheimnis (Erhöhter Schutzbedarf) unterliegen, verarbeiten. Ich zeige Dir jetzt die Hauptfunktionen von Transcribo."
+        },
+        "transcriptionInfo": {
+            "title": "Transkriptions-Info",
+            "description": "Klicke hier um den Namen der Transkription zu ändern oder die Original-Mediendatei herunterzuladen."
+        },
+        "exportToolbar": {
+            "title": "Exportieren",
+            "description": "Klicke hier um deine Transkription zu exportieren. Du kannst zwischen Text-, Untertitel (SRT)-, JSON- oder Word (DOCX)-Format wählen."
+        },
+        "modes": {
+            "title": "Die Vier Modi",
+            "description": "Betrachter: Transkription ansehen und lesen\n\nZusammenfassung: KI-gestützte Zusammenfassungen erstellen\n\nEditor: Text, Zeitstempel und Sprecher bearbeiten\n\nStatistik: Sprechzeit-Verteilung anzeigen"
+        },
+        "viewerIntro": {
+            "title": "Betrachter-Modus",
+            "description": "Im Betrachter-Modus kannst du deine Transkription lesen."
+        },
+        "viewerDisplayOptions": {
+            "title": "Anzeigeoptionen",
+            "description": "Nutze die Anzeigeoptionen um Sprecher, Zeitstempel anzuzeigen/auszublenden oder aufeinanderfolgende Segmente desselben Sprechers zusammenzuführen."
+        },
+        "summary": {
+            "title": "Zusammenfassungs-Modus",
+            "description": "Wechsle in den Zusammenfassungs-Modus, um eine KI-gestützte Zusammenfassung deiner Transkription zu erstellen."
+        },
+        "generateSummary": {
+            "title": "Zusammenfassung Erstellen",
+            "description": "Klicke auf diesen Button um eine Zusammenfassung zu erstellen. Wähle zwischen Kurzprotokoll, Ergebnisprotokoll oder detailliertem Verhandlungsprotokoll."
+        },
+        "statistics": {
+            "title": "Statistik-Modus",
+            "description": "Wechsle in den Statistik-Modus um die Sprechzeit-Verteilung nach Sprechern zu sehen."
+        },
+        "speakerStatistics": {
+            "title": "Sprecher-Statistik",
+            "description": "Sieh dir die gesamte Audiodauer, Sprechzeit, den Sprachanteil und wie viel jeder Sprecher beigetragen hat an."
+        },
+        "editor": {
+            "title": "Editor-Modus",
+            "description": "Wechsle in den Editor-Modus um Änderungen an deiner Transkription vorzunehmen. Hier kannst du Text, Zeitstempel und Sprechernamen bearbeiten."
+        },
+        "speakerNames": {
+            "title": "Sprecher Umbenennen",
+            "description": "Hier kannst du die Sprecher umbenennen. Gib einfach einen neuen Namen ein und er wird auf alle Segmente dieses Sprechers angewendet."
+        },
+        "editTranscriptions": {
+            "title": "Transkriptionen Bearbeiten",
+            "description": "Jedes Segment kann bearbeitet werden: Ändere den Text, aktualisiere den Sprecher oder ändere Start- und Endzeiten. Klicke auf die Zeitstempel um zu dieser Position zu springen."
+        },
+        "addTranscription": {
+            "title": "Neue Transkription Hinzufügen",
+            "description": "Klicke auf den + Button um an beliebiger Stelle neue Transkriptionssegmente hinzuzufügen."
+        },
+        "mediaPlayback": {
+            "title": "Medienwiedergabe",
+            "description": "Nutze die Medienleiste um dein Audio oder Video abzuspielen."
+        },
+        "mediaExpand": {
+            "title": "Medienansicht Erweitern",
+            "description": "Klicke auf den Erweitern-Button um das Video oder die größere Ansicht mit Untertitelvorschau zu sehen."
+        },
+        "helpButton": {
+            "title": "Hilfe-Button",
+            "description": "Klicke jederzeit auf diesen Button um diese Tour erneut zu starten."
+        },
+        "complete": {
+            "title": "Du bist startklar!",
+            "description": "Du bist bereit, Transcribo zu nutzen! Klicke jederzeit auf den Hilfe-Button, um diese Tour erneut zu starten."
+        }
     }
 }
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 8d68282..88e66cb 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -25,12 +25,15 @@
         "tooManyRequestsTitle": "Too many requests",
         "tooManyRequestsDescription": "You've made too many requests. Please wait a few minutes before trying again.",
         "audioLanguage": "Audio Language",
-        "audioLanguageHelp": "What language was spoken in the audio file? If you are not sure, select 'Auto detection'."
+        "audioLanguageHelp": "What language was spoken in the audio file? If you are not sure, select 'Auto detection'.",
+        "settings": "Settings",
+        "configureTranscription": "Configure your transcription",
+        "settingsInfo": "These settings help improve transcription accuracy. You can leave both on auto-detection if you're unsure."
     },
     "pages": {
         "index": {
             "title": "Transcribo",
-            "subtitle": "Transcribe your audio and video files with AI. 96 languages and audio files up to 2 hours supported.",
+            "subtitle": "Transcribe your audio and video files with AI and automatically generate summaries. 96 languages and audio files up to 2 hours supported.",
             "uploadMedia": "Upload Media",
             "uploadDescription": "Upload your audio or video files",
             "recordAudio": "Record Audio",
@@ -71,7 +74,8 @@
         "play": "Play",
         "pause": "Pause",
         "addSegment": "Add Segment",
-        "downloadMedia": "Download Media"
+        "downloadMedia": "Download Media",
+        "noMedia": "No media file available"
     },
     "taskStatus": {
         "processing": "Processing your request...",
@@ -90,6 +94,13 @@
         "notFound": "Transcription not found or failed to load",
         "noTranscriptionsFound": "No transcriptions found",
         "untitled": "Untitled",
+        "info": "Transcription Info",
+        "nameLabel": "Name",
+        "namePlaceholder": "Transcription name",
+        "autoScrollOn": "Auto-scroll ON",
+        "autoScrollOff": "Auto-scroll OFF",
+        "tab": "Transcription",
+        "timelineTab": "Timeline",
         "delete": {
             "title": "Delete Transcription",
             "confirmation": "Are you sure you want to delete this transcription?"
@@ -118,7 +129,7 @@
         "withTimestamps": "Include timestamps",
         "mergeSegments": "Merge segments from same speaker",
         "withSummary": "Include meeting summary",
-        "textOnly": "Text format only",
+        "textOnly": "Text and Word formats only",
         "export": "Export",
         "options": "Options",
         "optionsTitle": "Export Options",
@@ -126,7 +137,8 @@
             "title": "Export Formats",
             "text": "Text Format",
             "subtitle": "Subtitle Format",
-            "json": "JSON Format"
+            "json": "JSON Format",
+            "docx": "Word Document"
         },
         "exportAsText": "Export as text",
         "exportAsSrt": "Export as SRT"
@@ -139,7 +151,20 @@
         "show": "Show Summary",
         "hide": "Hide Summary",
         "title": "Meeting Summary",
-        "error": "Summary Generation Error"
+        "error": "Summary Generation Error",
+        "empty": "No summary generated yet",
+        "export": "Export Summary",
+        "selectType": "Select Summary Type",
+        "selectLanguage": "Output Language",
+        "autoDetect": "Auto-detect",
+        "types": {
+            "kurzprotokoll": "Short Protocol",
+            "kurzprotokollDesc": "Brief summary of key points and decisions",
+            "ergebnisprotokoll": "Results Protocol",
+            "ergebnisprotokollDesc": "Focus exclusively on outcomes, decisions, and action items",
+            "verhandlungsprotokoll": "Negotiation Protocol",
+            "verhandlungsprotokollDesc": "Detailed protocol with discussions and reasoning"
+        }
     },
     "task": {
         "errors": {
@@ -147,7 +172,8 @@
             "failedToLoad": "Failed to get task",
             "transcriptionFailed": "Transcription failed. Please try again.",
             "failedToCreateTranscription": "Failed to create transcription from results",
-            "noResult": "No transcription result available"
+            "noResult": "No transcription result available",
+            "TaskNotFound": "Task not found"
         }
     },
     "commands": {
@@ -175,9 +201,20 @@
     },
     "mode": {
         "viewer": "Viewer",
+        "summary": "Summary",
         "editor": "Editor",
+        "statistics": "Statistics",
         "switch": "Switch Mode"
     },
+    "statistics": {
+        "title": "Speaker Statistics",
+        "description": "Speaking time distribution by speaker",
+        "noData": "No speaker data available",
+        "audioDuration": "Audio Duration",
+        "speakingTime": "Speaking Time",
+        "speakingPercentage": "Speech Ratio",
+        "bySpeaker": "By Speaker"
+    },
     "help": {
         "help": "Help",
         "title": "Help Guide - Transcribo",
@@ -253,7 +290,10 @@
         "showAbandonedRecordings": "Show abandoned recordings"
     },
     "languages": {
+        "autoDetect": "Auto-detect",
         "de": "German",
+        "en-us": "English (US)",
+        "en-gb": "English (UK)",
         "en": "English",
         "fr": "French",
         "it": "Italian",
@@ -356,5 +396,84 @@
     "retention": {
         "title": "Availability of Transcriptions",
         "description": "Transcriptions older than {retentionDays} days are automatically deleted."
+    },
+    "onboarding": {
+        "help": "Show Help Tour",
+        "next": "Next",
+        "previous": "Previous",
+        "done": "Done",
+        "progress": "{'{{current}}'} von {'{{total}}'}",
+        "welcome": {
+            "title": "Welcome to Transcribo!",
+            "description": "Transcribo is an AI-powered transcription service that helps you transcribe audio and video files. All data is processed on local servers of IT BS. You can also process special personal data and data subject to official secrecy (increased protection requirements) with Transcribo. I will now show you the main features of Transcribo."
+        },
+        "transcriptionInfo": {
+            "title": "Transcription Info",
+            "description": "Click here to view and change the transcription name, or download the original media file."
+        },
+        "exportToolbar": {
+            "title": "Export",
+            "description": "Click here to export your transcription. You can choose between text, subtitle (SRT), JSON, or Word (DOCX) formats."
+        },
+        "modes": {
+            "title": "The Four Modes",
+            "description": "Viewer: View and read your transcription\n\nSummary: Generate AI-powered summaries\n\nEditor: Edit text, timestamps, and speakers\n\nStatistics: See speaking time distribution"
+        },
+        "viewerIntro": {
+            "title": "Viewer Mode",
+            "description": "In Viewer mode, you can read your transcription."
+        },
+        "viewerDisplayOptions": {
+            "title": "Display Options",
+            "description": "Use the display options to show/hide speakers, timestamps, or merge consecutive segments from the speaker."
+        },
+        "summary": {
+            "title": "Summary Mode",
+            "description": "Switch to Summary mode to generate an AI-powered summary of your transcription."
+        },
+        "generateSummary": {
+            "title": "Generate Summary",
+            "description": "Click this button to generate a summary. Choose between short protocol, results protocol, or detailed negotiation protocol."
+        },
+        "statistics": {
+            "title": "Statistics Mode",
+            "description": "Switch to Statistics mode to see the speaking time distribution by speaker."
+        },
+        "speakerStatistics": {
+            "title": "Speaker Statistics",
+            "description": "View the total audio duration, speaking time, speech ratio, and how much each speaker contributed."
+        },
+        "editor": {
+            "title": "Editor Mode",
+            "description": "Switch to Editor mode to make changes to your transcription. You can edit text, timestamps, and speaker names here."
+        },
+        "speakerNames": {
+            "title": "Rename Speakers",
+            "description": "Here you can rename the speakers. Just type a new name and it will be applied to all segments from this speaker."
+        },
+        "editTranscriptions": {
+            "title": "Edit Transcriptions",
+            "description": "Each segment can be edited: change the text, update the speaker, or modify the start and end times. Click the timestamps to jump to that position."
+        },
+        "addTranscription": {
+            "title": "Add New Transcriptions",
+            "description": "Click the + button to add new transcription segments at any position."
+        },
+        "mediaPlayback": {
+            "title": "Media Playback",
+            "description": "Use the media bar to play your audio or video."
+        },
+        "mediaExpand": {
+            "title": "Expand Media View",
+            "description": "Click the expand button to see the video/larger view with subtitle preview."
+        },
+        "helpButton": {
+            "title": "Help Button",
+            "description": "Click this button anytime to restart this tour."
+        },
+        "complete": {
+            "title": "You're All Set!",
+            "description": "You're ready to use Transcribo! Click the help button anytime to see this tour again."
+        }
     }
 }
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 32c478c..640d805 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -3,6 +3,12 @@ import pwaIcons from "./public/icons.json";
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
     compatibilityDate: "2024-11-01",
+    extends: [
+        ["github:DCC-BS/nuxt-layers/backend_communication", { install: true }],
+        ["github:DCC-BS/nuxt-layers/health_check", { install: true }],
+        ["github:DCC-BS/nuxt-layers/feedback-control", { install: true }],
+        ["github:DCC-BS/nuxt-layers/logger"],
+    ],
     routeRules: {
         "/api/ping": {
             cors: true,
@@ -19,11 +25,17 @@ export default defineNuxtConfig({
     runtimeConfig: {
         githubToken: process.env.GITHUB_TOKEN,
         apiUrl: process.env.API_URL,
+        useDummyData: process.env.DUMMY || "",
         public: {
             logger_bs: {
                 loglevel: process.env.LOG_LEVEL || "debug",
             },
         },
+        feedback: {
+            repo: "Feedback",
+            repoOwner: "DCC-BS",
+            project: "Transcribo",
+        },
     },
     nitro: {
         routeRules: {
@@ -38,13 +50,6 @@ export default defineNuxtConfig({
             },
         },
     },
-    $development: {
-        vite: {
-            server: {
-                allowedHosts: ["robust-nationally-lacewing.ngrok-free.app"],
-            },
-        },
-    },
     vite: {
         optimizeDeps: {
             exclude: ["@ffmpeg/ffmpeg", "@ffmpeg/util", "@vueuse/core"],
@@ -58,7 +63,6 @@ export default defineNuxtConfig({
                 allow: [".."],
             },
         },
-
         worker: {
             format: "es",
         },
@@ -131,25 +135,34 @@ export default defineNuxtConfig({
         "@nuxtjs/i18n",
         "@dcc-bs/common-ui.bs.js",
         "@dcc-bs/event-system.bs.js",
-        "@dcc-bs/logger.bs.js",
-        "@dcc-bs/feedback-control.bs.js",
         "@dcc-bs/audio-recorder.bs.js",
-        "@pinia/nuxt",
         "@vite-pwa/nuxt",
         "@nuxtjs/mdc",
+        "motion-v/nuxt",
     ],
     typescript: {
         strict: true,
-        typeCheck: true,
+        typeCheck: false,
     },
-    devtools: { enabled: true },
-    css: ["~/assets/css/main.css"],
-    "feedback-control.bs.js": {
-        repo: "Feedback",
-        owner: "DCC-BS",
-        project: "Transcribo",
-        githubToken: process.env.GITHUB_TOKEN,
+    devtools: { enabled: false },
+    // Bug: https://github.com/nuxt/ui/issues/6118
+    hooks: {
+        "imports:extend"(imports) {
+            for (let i = imports.length - 1; i >= 0; i--) {
+                const e = imports[i];
+                if (
+                    e?.name === "options" &&
+                    typeof e.from === "string" &&
+                    e.from.includes(
+                        "@nuxt/ui/dist/runtime/composables/useResizable",
+                    )
+                ) {
+                    imports.splice(i, 1);
+                }
+            }
+        },
     },
+    css: ["~/assets/css/main.css"],
     // localization
     i18n: {
         locales: [
@@ -165,7 +178,7 @@ export default defineNuxtConfig({
             },
         ],
         defaultLocale: "de",
-        strategy: "prefix_except_default",
+        strategy: "no_prefix",
     },
     pwa: {
         devOptions: {
diff --git a/package.json b/package.json
index 0b73421..f6673de 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "transcribo-frontend",
-    "version": "0.5.4",
+    "version": "1.0.0",
     "private": true,
     "scripts": {
         "dev": "nuxt dev",
@@ -9,6 +9,9 @@
         "generate": "nuxt generate",
         "lint": "biome format --write",
         "check": "biome check --fix",
+        "test": "vitest",
+        "test:run": "vitest run",
+        "test:coverage": "vitest run --coverage",
         "docker:dev": "docker compose -f ./docker-compose.dev.yml up --build -d",
         "docker:prod": "docker compose -f ./docker-compose.yml up --build -d",
         "docker:dev:down": "docker compose -f ./docker-compose.dev.yml down",
@@ -16,36 +19,44 @@
     },
     "dependencies": {
         "@dcc-bs/audio-recorder.bs.js": "^2.0.1",
-        "@dcc-bs/common-ui.bs.js": "^1.1.11",
-        "@dcc-bs/communication.bs.js": "^0.1.1",
-        "@dcc-bs/event-system.bs.js": "git+https://github.com/DCC-BS/event-system.bs.js.git#v1.4.1",
-        "@dcc-bs/feedback-control.bs.js": "git+https://github.com/DCC-BS/feedback-control.bs.js.git#v0.1.6",
-        "@dcc-bs/logger.bs.js": "git+https://github.com/DCC-BS/logger.bs.js.git#v1.4.1",
+        "@dcc-bs/common-ui.bs.js": "^1.2.5",
+        "@dcc-bs/communication.bs.js": "0.1.3",
+        "@dcc-bs/event-system.bs.js": "^1.4.3",
         "@ffmpeg/ffmpeg": "^0.12.15",
         "@ffmpeg/util": "^0.12.2",
-        "@iconify-json/lucide": "^1.2.75",
-        "@nuxt/ui": "^4.2.1",
-        "@nuxtjs/i18n": "^10.2.1",
-        "@nuxtjs/mdc": "^0.20.0",
-        "@pinia/nuxt": "0.11.3",
+        "@iconify-json/lucide": "1.2.95",
+        "@mohtasham/md-to-docx": "^2.8.0",
+        "@nuxt/ui": "4.5.1",
+        "@nuxtjs/i18n": "10.2.3",
+        "@nuxtjs/mdc": "0.20.1",
         "@vite-pwa/nuxt": "1.1.1",
-        "konva": "^10.0.12",
-        "motion-v": "^1.7.4",
+        "@vueuse/core": "^14.2.1",
+        "dexie": "^4.3.0",
+        "driver.js": "^1.4.0",
+        "konva": "10.2.0",
+        "motion-v": "2.0.0",
         "nuxt": "4.3.1",
+        "pino": "10.3.1",
         "ts-pattern": "^5.9.0",
         "uuid": "^13.0.0",
-        "vue": "^3.5.25",
-        "vue-konva": "^3.2.6",
-        "vue-router": "^4.6.3",
-        "vue-tsc": "^3.1.5",
-        "zod": "^4.1.13"
+        "vue": "3.5.29",
+        "vue-konva": "3.3.0",
+        "vue-tsc": "3.2.5",
+        "zod": "4.3.6"
     },
     "devDependencies": {
-        "@biomejs/biome": "2.4.2",
-        "@types/bun": "^1.3.3",
+        "@biomejs/biome": "2.4.5",
+        "@nuxt/test-utils": "^4.0.0",
+        "@types/bun": "1.3.10",
+        "@vitest/coverage-v8": "^4.0.18",
+        "@vue/test-utils": "^2.4.6",
+        "happy-dom": "20.8.3",
         "jiti": "^2.6.1",
+        "msw": "^2.12.10",
+        "pino-pretty": "^13.1.3",
         "sass": "1.97.3",
-        "sass-loader": "^16.0.6",
-        "typescript": "^5.9.3"
+        "sass-loader": "16.0.7",
+        "typescript": "^5.9.3",
+        "vitest": "^4.0.18"
     }
 }
diff --git a/server/api/health/liveness.get.ts b/server/api/health/liveness.get.ts
deleted file mode 100644
index bda3fc9..0000000
--- a/server/api/health/liveness.get.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-/**
- * Liveness Probe - /health/liveness
- * * Kubernetes uses this to know if the container is running.
- * If this fails, the container is KILLED and RESTARTED.
- * * CRITICAL: Do NOT check databases or external services here.
- * If your DB is down, you want your pod to stay up (and just fail readiness),
- * not constantly restart.
- */
-
-export default defineEventHandler(() => {
-    // This lightweight check ensures the Nitro event loop is not blocked.
-    return {
-        status: "up",
-        uptime: process.uptime(),
-    };
-});
diff --git a/server/api/health/readiness.get.ts b/server/api/health/readiness.get.ts
deleted file mode 100644
index 256fe04..0000000
--- a/server/api/health/readiness.get.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { apiFetch, isApiError } from "@dcc-bs/communication.bs.js";
-
-type ReadinessCheck = {
-    status: "ready" | "unhealthy";
-    checks: {
-        api: "connected" | "disconnected" | "unknown";
-    };
-};
-
-/**
- * Readiness Probe - /health/readiness
- * * Kubernetes uses this to know if the pod is ready to accept traffic.
- * If this fails, the pod is removed from the Service endpoints (load balancer).
- * * Use this to check critical dependencies (upstream APIs, DBs, other).
- */
-
-export default defineEventHandler(async () => {
-    const healthCheck: ReadinessCheck = {
-        status: "ready",
-        checks: {
-            api: "unknown",
-        },
-    };
-
-    try {
-        const config = useRuntimeConfig();
-
-        const response = await apiFetch<ReadinessCheck>(
-            `${config.apiUrl}/health/readiness`,
-        );
-
-        if (isApiError(response)) {
-            throw new Error(
-                `Upstream API health check failed: ${response.status} ${response.debugMessage}`,
-            );
-        }
-
-        // Simulate a successful check for now
-        healthCheck.checks.api = "connected";
-
-        return healthCheck;
-    } catch (error) {
-        // If a critical dependency fails, we must return a 503.
-        // This tells K8s to stop sending traffic to this specific pod.
-        throw createError({
-            statusCode: 503,
-            statusMessage: "Service Unavailable",
-            data: {
-                status: "unhealthy",
-                error: error instanceof Error ? error.message : "Unknown error",
-            },
-        });
-    }
-});
diff --git a/server/api/health/startup.get.ts b/server/api/health/startup.get.ts
deleted file mode 100644
index 674915b..0000000
--- a/server/api/health/startup.get.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-/**
- * Startup Probe - /health/startup
- * * Kubernetes uses this for slow-starting applications.
- * It holds off the Liveness/Readiness probes until this returns 200.
- * * Once this passes *once*, it is never checked again for the lifecycle of the pod.
- */
-
-export default defineEventHandler(() => {
-    return {
-        status: "started",
-        timestamp: new Date().toISOString(),
-    };
-});
diff --git a/server/api/summarize/submit.post.ts b/server/api/summarize/submit.post.ts
index 8a74620..75cd6d2 100644
--- a/server/api/summarize/submit.post.ts
+++ b/server/api/summarize/submit.post.ts
@@ -1,38 +1,24 @@
-import type { SummaryResponse } from "~/types/summarizeResponse";
-import { verboseFetch } from "../../utils/verboseFetch";
+import { ApiError } from "@dcc-bs/communication.bs.js";
+import { summarizeSchema } from "#shared/types/summary";
+import { apiHandler } from "~~/server/utils/apiHanlder";
+import { dummySummaryFetcher } from "~~/server/utils/dummyData";
 
-export default defineEventHandler(async (event) => {
-    const clientUUID = getHeader(event, "X-Ephemeral-UUID");
+export default apiHandler
+    .withMethod("POST")
+    .withBodyProvider(async (event) => {
+        const body = await readBody(event);
 
-    const config = useRuntimeConfig();
+        const result = summarizeSchema.safeParse(body);
 
-    const inputFormData = await readFormData(event);
-    const transcriptValue = inputFormData.get("transcript");
-    const transcript =
-        typeof transcriptValue === "string" ? transcriptValue : null;
+        if (!result.success) {
+            throw new ApiError(
+                "summarize_invalid_input",
+                400,
+                result.error.message,
+            );
+        }
 
-    if (!transcript) {
-        throw createError({
-            statusCode: 400,
-            statusMessage: "transcript not provided",
-        });
-    }
-
-    // Attempt to make the API request
-    const response = await verboseFetch<SummaryResponse>(
-        `${config.apiUrl}/summarize`,
-        event,
-        {
-            method: "POST",
-            headers: {
-                "Content-Type": "application/json",
-                "X-Client-Id": clientUUID || "",
-            },
-            body: JSON.stringify({
-                transcript: transcript,
-            }),
-        },
-    );
-
-    return response;
-});
+        return result.data;
+    })
+    .withDummyFetcher(dummySummaryFetcher)
+    .build("/summarize");
diff --git a/server/api/transcribe/[task_id]/index.get.ts b/server/api/transcribe/[task_id]/index.get.ts
index 4f7e699..5f7c064 100644
--- a/server/api/transcribe/[task_id]/index.get.ts
+++ b/server/api/transcribe/[task_id]/index.get.ts
@@ -1,30 +1,7 @@
-import type { TranscriptionResponse } from "~/types/transcriptionResponse";
-import { verboseFetch } from "../../../utils/verboseFetch";
+import { apiHandler } from "~~/server/utils/apiHanlder";
+import { dummyTranscriptionResultFetcher } from "~~/server/utils/dummyData";
 
-export default defineEventHandler(async (event) => {
-    const config = useRuntimeConfig();
-    const taskId = getRouterParam(event, "task_id");
-
-    try {
-        return await verboseFetch<TranscriptionResponse>(
-            `${config.apiUrl}/task/${taskId}/result`,
-            event,
-        );
-    } catch (error: unknown) {
-        // Handle 404 errors gracefully - task not found on backend
-        if (
-            error &&
-            typeof error === "object" &&
-            "statusCode" in error &&
-            error.statusCode === 404
-        ) {
-            throw createError({
-                statusCode: 404,
-                statusMessage:
-                    "Task not found - may have been removed after backend restart",
-            });
-        }
-        // Re-throw other errors
-        throw error;
-    }
-});
+export default apiHandler
+    .withMethod("GET")
+    .withDummyFetcher(dummyTranscriptionResultFetcher)
+    .build("/task/[r:task_id]/result");
diff --git a/server/api/transcribe/[task_id]/status.get.ts b/server/api/transcribe/[task_id]/status.get.ts
index e79ebc6..3fe8f85 100644
--- a/server/api/transcribe/[task_id]/status.get.ts
+++ b/server/api/transcribe/[task_id]/status.get.ts
@@ -1,33 +1,7 @@
-import type { TaskStatus } from "~/types/task";
-import { verboseFetch } from "../../../utils/verboseFetch";
+import { apiHandler } from "~~/server/utils/apiHanlder";
+import { dummyTaskStatusFetcher } from "~~/server/utils/dummyData";
 
-export default defineEventHandler(async (event) => {
-    const config = useRuntimeConfig();
-    const taskId = getRouterParam(event, "task_id");
-
-    try {
-        return await verboseFetch<TaskStatus>(
-            `${config.apiUrl}/task/${taskId}/status`,
-            event,
-            {
-                method: "GET",
-            },
-        );
-    } catch (error: unknown) {
-        // Handle 404 errors gracefully - task not found on backend
-        if (
-            error &&
-            typeof error === "object" &&
-            "statusCode" in error &&
-            error.statusCode === 404
-        ) {
-            throw createError({
-                statusCode: 404,
-                statusMessage:
-                    "Task not found - may have been removed after backend restart",
-            });
-        }
-        // Re-throw other errors
-        throw error;
-    }
-});
+export default apiHandler
+    .withMethod("GET")
+    .withDummyFetcher(dummyTaskStatusFetcher)
+    .build("/task/[r:task_id]/status");
diff --git a/server/api/transcribe/submit.post.ts b/server/api/transcribe/submit.post.ts
index ffb27c2..c1ff4a1 100644
--- a/server/api/transcribe/submit.post.ts
+++ b/server/api/transcribe/submit.post.ts
@@ -1,62 +1,50 @@
-import type { TaskStatus } from "~/types/task";
-import { verboseFetch } from "../../utils/verboseFetch";
+import { apiFetch } from "@dcc-bs/communication.bs.js";
+import { z } from "zod";
+import { apiHandler } from "~~/server/utils/apiHanlder";
+import {
+    createDummyTaskStatus,
+    generateDummyTaskId,
+} from "~~/server/utils/dummyData";
+
+const transcribeSchema = z.object({
+    audio_file: z.file(),
+    num_speakers: z.enum(["0", "1", "2", "3", "4", "5", "6"]).optional(),
+    language: z.string().optional(),
+});
 
-export default defineEventHandler(async (event) => {
-    const config = useRuntimeConfig();
+export default apiHandler
+    .withMethod("POST")
+    .withBodyProvider(async (event) => {
+        const inputFromData = await readFormData(event);
+
+        const result = transcribeSchema.safeParse(
+            Object.fromEntries(inputFromData.entries()),
+        );
+
+        if (!result.success) {
+            throw createError({
+                statusCode: 400,
+                data: {
+                    errorId: "invalid_transcribe_input",
+                    status: 400,
+                    debugMessage: result.error.message,
+                },
+            });
+        }
 
-    const clientUUID = getHeader(event, "X-Ephemeral-UUID");
+        return inputFromData;
+    })
+    .withFetcher(async (options) => {
+        const response = await apiFetch(options.url, {
+            method: "POST",
+            body: options.body,
+        });
 
-    const inputFormData = await readFormData(event);
-    const fileContent = inputFormData.get("file") as File;
-    const numSpeakersRaw = inputFormData.get("num_speakers") as string;
-    const audioLanguageRaw = inputFormData.get("audio_language") as string;
+        const logger = getEventLogger(options.event);
 
-    if (!fileContent) {
-        throw createError({
-            statusCode: 400,
-            statusMessage: "File not provided",
-        });
-    }
-
-    const formData = new FormData();
-    formData.append("audio_file", fileContent, fileContent.name);
-
-    let apiParameter = "";
-    // Handle num_speakers parameter
-    if (numSpeakersRaw && numSpeakersRaw !== "null") {
-        const numSpeakers = Number.parseInt(numSpeakersRaw, 10);
-        if (
-            !Number.isNaN(numSpeakers) &&
-            numSpeakers >= 1 &&
-            numSpeakers <= 6
-        ) {
-            apiParameter = `?num_speakers=${numSpeakers}`;
-        }
-        // If invalid value, don't include the parameter (auto detection)
-    }
-
-    // Handle audio_language parameter
-    if (audioLanguageRaw && audioLanguageRaw !== "null") {
-        if (apiParameter === "") {
-            apiParameter += "?";
-        } else {
-            apiParameter += "&";
-        }
-        apiParameter += `language=${audioLanguageRaw}`;
-    }
-
-    // Attempt to make the API request
-    const response = await verboseFetch<TaskStatus>(
-        `${config.apiUrl}/transcribe${apiParameter}`,
-        event,
-        {
-            method: "POST",
-            body: formData,
-            headers: {
-                "X-Client-Id": clientUUID || "",
-            },
-        },
-    );
-
-    return response;
-});
+        logger.info({ response: response }, "Transcription request submitted");
+
+        return response;
+    })
+    .withDummyFetcher(createDummyTaskStatus(generateDummyTaskId()))
+    .build("/transcribe");
diff --git a/server/changelogs/v0.5.0.md b/server/assets/changelogs/v0.5.0.md
similarity index 100%
rename from server/changelogs/v0.5.0.md
rename to server/assets/changelogs/v0.5.0.md
diff --git a/server/assets/changelogs/v0.6.0.md b/server/assets/changelogs/v0.6.0.md
new file mode 100644
index 0000000..5c907fc
--- /dev/null
+++ b/server/assets/changelogs/v0.6.0.md
@@ -0,0 +1,23 @@
+---
+title: "Version 0.6.0"
+version: "0.6.0"
+published_at: "2026-2-27"
+---
+
+## Großes UI-Redesign und neue Funktionen
+
+### Neue Funktionen
+- **Komplettes UI-Redesign**: Die Transkriptions-Detailseite wurde mit modernen Animationen und verbesserter Benutzerfreundlichkeit neu gestaltet.
+- **Medien-Wiedergabeleiste**: Neue ausklappbare Wiedergabeleiste mit Video-/Audiovorschau und Live-Untertiteln während der Wiedergabe.
+- **Zusammenfassungs-Typen**: Drei verschiedene Zusammenfassungsformate verfügbar:
+  - Kurzprotokoll: Kurze Zusammenfassung der wichtigsten Punkte
+  - Ergebnisprotokoll: Fokus auf Ergebnisse, Entscheidungen und Aufgaben
+  - Verhandlungsprotokoll: Detailliertes Protokoll mit Diskussionen
+- **Sprecher-Statistik**: Neue Statistikansicht zeigt die Sprechzeit-Verteilung nach Sprechern.
+- **Zeitleisten-Editor**: Neuer Editor für die Bearbeitung direkt in der Zeitleiste.
+- **Tastaturkürzel**: Übersichtliche Anzeige aller verfügbaren Tastaturkürzel.
+- **Word-Export**: Transkriptionen und Zusammenfassungen können jetzt als Word-Dokument (.docx) exportiert werden, mit Optionen für Sprecher, Zeitstempel und zusammengeführte Segmente.
+
+### Verbesserungen
+- Verbesserte Navigation und Übersichtlichkeit der Transkriptionsliste.
+- Optimierte Medienverarbeitung mit besserer Fortschrittsanzeige.
diff --git a/server/plugins/startup-log.ts b/server/plugins/startup-log.ts
deleted file mode 100644
index b7076f7..0000000
--- a/server/plugins/startup-log.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-const filter_secrets = (str: string) => {
-    const secrets = ["githubToken"];
-    return secrets.reduce((acc, secret) => {
-        return acc.replace(
-            new RegExp(`"${secret}":"([^"]+)"`, "g"),
-            `"${secret}":"********"`,
-        );
-    }, str);
-};
-
-export default defineNitroPlugin(() => {
-    // Check if running in development environment
-    if (process.env.NODE_ENV === "development") {
-        return;
-    }
-
-    console.log("App started");
-
-    const config = useRuntimeConfig();
-
-    console.log("Runtime config", filter_secrets(JSON.stringify(config)));
-});
diff --git a/server/utils/apiHanlder.ts b/server/utils/apiHanlder.ts
new file mode 100644
index 0000000..f79a256
--- /dev/null
+++ b/server/utils/apiHanlder.ts
@@ -0,0 +1,8 @@
+export const apiHandler = backendHandlerBuilder().extendFetchOptions(
+    async (options) => {
+        const clientUUID = getHeader(options.event, "X-Ephemeral-UUID");
+        const headers = { "X-Client-Id": clientUUID || "", ...options.headers };
+
+        return { ...options, headers };
+    },
+);
diff --git a/server/utils/dummyData.ts b/server/utils/dummyData.ts
new file mode 100644
index 0000000..2409c4d
--- /dev/null
+++ b/server/utils/dummyData.ts
@@ -0,0 +1,141 @@
+export interface DummyTaskStatus {
+    task_id: string;
+    status: "in_progress" | "completed" | "failed" | "cancelled";
+    created_at: string | null;
+    executed_at: string | null;
+    progress: number | null;
+}
+
+export interface DummySegment {
+    start: number;
+    end: number;
+    text: string;
+    speaker: string | null;
+}
+
+export interface DummyTranscriptionResponse {
+    segments: DummySegment[];
+}
+
+export interface DummySummary {
+    summary: string;
+}
+
+const SAMPLE_TRANSCRIPT_SEGMENTS: DummySegment[] = [
+    {
+        start: 0.0,
+        end: 4.2,
+        text: "Good morning everyone, thank you for joining today's meeting about the new product launch.",
+        speaker: "Speaker_1",
+    },
+    {
+        start: 4.5,
+        end: 8.9,
+        text: "I'd like to start by going over the timeline and key milestones we need to hit.",
+        speaker: "Speaker_1",
+    },
+    {
+        start: 9.3,
+        end: 14.1,
+        text: "That sounds great. I've prepared the marketing materials and they're ready for review.",
+        speaker: "Speaker_2",
+    },
+    {
+        start: 14.5,
+        end: 19.8,
+        text: "Excellent. What about the technical side? Are we on track with development?",
+        speaker: "Speaker_1",
+    },
+    {
+        start: 20.2,
+        end: 26.4,
+        text: "Yes, the engineering team has completed the core features. We're now focusing on testing and bug fixes.",
+        speaker: "Speaker_3",
+    },
+    {
+        start: 26.8,
+        end: 32.1,
+        text: "We've identified a few performance issues, but they should be resolved by end of week.",
+        speaker: "Speaker_3",
+    },
+    {
+        start: 32.5,
+        end: 37.6,
+        text: "What's our budget situation? Do we have enough resources for the launch campaign?",
+        speaker: "Speaker_2",
+    },
+    {
+        start: 38.0,
+        end: 44.3,
+        text: "We're currently within budget. I've allocated funds for both digital and traditional marketing channels.",
+        speaker: "Speaker_4",
+    },
+    {
+        start: 44.7,
+        end: 50.9,
+        text: "Great. Let's schedule a follow-up meeting next Tuesday to finalize the launch strategy.",
+        speaker: "Speaker_1",
+    },
+    {
+        start: 51.3,
+        end: 56.5,
+        text: "I'll send out calendar invites and the meeting agenda by end of day.",
+        speaker: "Speaker_2",
+    },
+    {
+        start: 56.9,
+        end: 61.2,
+        text: "Perfect. Thank you all for your hard work. Let's make this launch a success.",
+        speaker: "Speaker_1",
+    },
+    {
+        start: 61.6,
+        end: 65.0,
+        text: "Any questions before we wrap up?",
+        speaker: "Speaker_1",
+    },
+];
+
+const SAMPLE_SUMMARY =
+    "The meeting covered the upcoming product launch, with discussions on timelines, marketing materials, technical development progress, and budget allocation. The engineering team has completed core features and is now in testing phase. Marketing materials are ready for review. Budget is on track with allocation for both digital and traditional channels. A follow-up meeting was scheduled for next Tuesday to finalize the launch strategy.";
+
+export function createDummyTaskStatus(taskId: string): DummyTaskStatus {
+    return {
+        task_id: taskId,
+        status: "completed",
+        created_at: new Date(Date.now() - 300000).toISOString(),
+        executed_at: new Date(Date.now() - 60000).toISOString(),
+        progress: 1.0,
+    };
+}
+
+export function createDummyTranscriptionResponse(): DummyTranscriptionResponse {
+    return {
+        segments: SAMPLE_TRANSCRIPT_SEGMENTS,
+    };
+}
+
+export function createDummySummary(): DummySummary {
+    return {
+        summary: SAMPLE_SUMMARY,
+    };
+}
+
+export function generateDummyTaskId(): string {
+    return `dummy-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+}
+
+export function dummyTaskStatusFetcher(options: {
+    url: string;
+}): DummyTaskStatus {
+    const taskId = options.url.split("/").pop() || generateDummyTaskId();
+    return createDummyTaskStatus(taskId);
+}
+
+export function dummyTranscriptionResultFetcher(): DummyTranscriptionResponse {
+    return createDummyTranscriptionResponse();
+}
+
+export function dummySummaryFetcher(): DummySummary {
+    return createDummySummary();
+}
diff --git a/server/utils/verboseFetch.ts b/server/utils/verboseFetch.ts
deleted file mode 100644
index bcf321d..0000000
--- a/server/utils/verboseFetch.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-import type { H3Event } from "h3";
-import { createError } from "h3"; // Import createError from h3
-import type { NitroFetchOptions, NitroFetchRequest } from "nitropack";
-export type Methods = "get" | "post" | "put" | "delete" | "patch";
-
-// Update the generic type parameters to handle the response type correctly
-export async function verboseFetch<T>(
-    url: string,
-    event: H3Event,
-    init?: NitroFetchOptions<NitroFetchRequest, Methods>,
-): Promise<T> {
-    const logger = getEventLogger(event);
-
-    try {
-        // Use type assertion to specify that the return value will be of type T
-        // This tells TypeScript that we're handling the conversion from TypedInternalResponse to T
-        const response = await $fetch(url, init);
-        return response as unknown as T; // NOSONAR
-    } catch (error: unknown) {
-        // Use unknown as it's safer for caught errors
-        // Cast to a more specific type that we expect from $fetch errors
-        const fetchError = error as {
-            message: string;
-            response?: {
-                status: number;
-                headers: Headers;
-            };
-            data?: unknown;
-        };
-
-        // Create a context object with all available error information
-        const errorContext = {
-            url,
-            method: init?.method ?? "GET",
-            errorMessage: fetchError.message,
-            status: fetchError.response?.status,
-            headers: fetchError.response?.headers
-                ? Object.fromEntries(fetchError.response.headers.entries())
-                : undefined,
-            errorData: fetchError.data,
-        };
-
-        // Log all error details in a single structured entry
-        logger.error("API request failed", errorContext);
-
-        // Re-throw the error to be handled by Nuxt's error system
-        // Provide more specific error messages for common HTTP status codes
-        let statusMessage = "Transcription request failed";
-
-        if (fetchError.response?.status === 413) {
-            statusMessage = "File too large";
-        } else if (fetchError.response?.status === 429) {
-            statusMessage = "Too many requests";
-        }
-
-        throw createError({
-            statusCode: fetchError.response?.status ?? 500,
-            statusMessage,
-            data: fetchError.data,
-        });
-    }
-}
diff --git a/shared/types/summary.ts b/shared/types/summary.ts
new file mode 100644
index 0000000..385e922
--- /dev/null
+++ b/shared/types/summary.ts
@@ -0,0 +1,17 @@
+import { z } from "zod";
+
+export const summaryTypeSchema = z.enum([
+    "verhandlungsprotokoll",
+    "kurzprotokoll",
+    "ergebnisprotokoll",
+]);
+
+export type SummaryType = z.infer<typeof summaryTypeSchema>;
+
+export const summarizeSchema = z.object({
+    transcript: z.string(),
+    summary_type: summaryTypeSchema,
+    language: z.string().optional(),
+});
+
+export type SummarizeRequest = z.infer<typeof summarizeSchema>;
diff --git a/tests/composables/dialog.test.ts b/tests/composables/dialog.test.ts
new file mode 100644
index 0000000..359a8a5
--- /dev/null
+++ b/tests/composables/dialog.test.ts
@@ -0,0 +1,102 @@
+import { describe, expect, it, vi, beforeEach } from "vitest";
+import { useDialog, useInitDialog } from "../../../app/composables/dialog";
+
+describe("dialog composable", () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+    });
+
+    describe("useDialog", () => {
+        it("should open dialog with message", () => {
+            const { openDialog } = useDialog();
+            const { isOpen, message } = useInitDialog();
+
+            expect(isOpen.value).toBe(false);
+
+            openDialog({ message: "Test message" });
+
+            expect(isOpen.value).toBe(true);
+            expect(message.value).toBe("Test message");
+        });
+
+        it("should open dialog with title and message", () => {
+            const { openDialog } = useDialog();
+            const { isOpen, title, message } = useInitDialog();
+
+            openDialog({ title: "Test Title", message: "Test message" });
+
+            expect(isOpen.value).toBe(true);
+            expect(title.value).toBe("Test Title");
+            expect(message.value).toBe("Test message");
+        });
+
+        it("should store onClose callback", () => {
+            const { openDialog } = useDialog();
+            const onClose = vi.fn();
+
+            openDialog({ message: "Test", onClose });
+
+            const { onClose: dialogOnClose } = useInitDialog();
+            dialogOnClose();
+
+            expect(onClose).toHaveBeenCalled();
+        });
+
+        it("should store onSubmit callback", () => {
+            const { openDialog } = useDialog();
+            const onSubmit = vi.fn();
+
+            openDialog({ message: "Test", onSubmit });
+
+            const { onSubmit: dialogOnSubmit } = useInitDialog();
+            dialogOnSubmit();
+
+            expect(onSubmit).toHaveBeenCalled();
+        });
+
+        it("should close dialog on onClose", () => {
+            const { openDialog } = useDialog();
+            const { isOpen, onClose } = useInitDialog();
+
+            openDialog({ message: "Test" });
+            expect(isOpen.value).toBe(true);
+
+            onClose();
+
+            expect(isOpen.value).toBe(false);
+        });
+
+        it("should close dialog on onSubmit", () => {
+            const { openDialog } = useDialog();
+            const { isOpen, onSubmit } = useInitDialog();
+
+            openDialog({ message: "Test" });
+            expect(isOpen.value).toBe(true);
+
+            onSubmit();
+
+            expect(isOpen.value).toBe(false);
+        });
+
+        it("should use empty string as default title", () => {
+            const { openDialog } = useDialog();
+            const { title } = useInitDialog();
+
+            openDialog({ message: "Test" });
+
+            expect(title.value).toBe("");
+        });
+    });
+
+    describe("useInitDialog", () => {
+        it("should return reactive refs", () => {
+            const { isOpen, title, message, onSubmit, onClose } = useInitDialog();
+
+            expect(isOpen.value).toBeDefined();
+            expect(title.value).toBeDefined();
+            expect(message.value).toBeDefined();
+            expect(typeof onSubmit).toBe("function");
+            expect(typeof onClose).toBe("function");
+        });
+    });
+});
diff --git a/tests/composables/speakerColor.test.ts b/tests/composables/speakerColor.test.ts
new file mode 100644
index 0000000..a381ce2
--- /dev/null
+++ b/tests/composables/speakerColor.test.ts
@@ -0,0 +1,79 @@
+import { describe, expect, it, vi, beforeEach } from "vitest";
+import { ref } from "vue";
+import { useSpeakerColor } from "../../../app/composables/speakerColor";
+
+vi.mock("../../../app/services/colorMapService", () => ({
+    getColorMap: vi.fn(() => (value: number) => ({
+        r: Math.floor(value * 255),
+        g: Math.floor(value * 128),
+        b: Math.floor(value * 64),
+    })),
+}));
+
+describe("useSpeakerColor", () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+    });
+
+    it("should return white color for undefined speaker", () => {
+        const speakers = ref<string[]>([]);
+        const { getSpeakerColor } = useSpeakerColor(speakers);
+
+        const color = getSpeakerColor(undefined);
+        expect(color).toEqual({ r: 1, g: 1, b: 1 });
+    });
+
+    it("should return white color for unknown speaker", () => {
+        const speakers = ref<string[]>(["Speaker 1"]);
+        const { getSpeakerColor } = useSpeakerColor(speakers);
+
+        const color = getSpeakerColor("Unknown Speaker");
+        expect(color).toEqual({ r: 1, g: 1, b: 1 });
+    });
+
+    it("should return color for known speaker", () => {
+        const speakers = ref<string[]>(["Speaker 1"]);
+        const { getSpeakerColor, colorDict } = useSpeakerColor(speakers);
+
+        const color = getSpeakerColor("Speaker 1");
+        expect(color).toEqual(colorDict.value["Speaker 1"]);
+    });
+
+    it("should handle multiple speakers", () => {
+        const speakers = ref<string[]>(["Speaker 1", "Speaker 2", "Speaker 3"]);
+        const { getSpeakerColor, colorDict } = useSpeakerColor(speakers);
+
+        expect(colorDict.value["Speaker 1"]).toBeDefined();
+        expect(colorDict.value["Speaker 2"]).toBeDefined();
+        expect(colorDict.value["Speaker 3"]).toBeDefined();
+    });
+
+    it("should update colors when speakers change", () => {
+        const speakers = ref<string[]>(["Speaker 1"]);
+        const { colorDict } = useSpeakerColor(speakers);
+
+        const initialColor = colorDict.value["Speaker 1"];
+
+        speakers.value = ["Speaker 1", "Speaker 2"];
+
+        expect(colorDict.value["Speaker 1"]).toBeDefined();
+        expect(colorDict.value["Speaker 2"]).toBeDefined();
+    });
+
+    it("should filter out undefined values in speakers array", () => {
+        const speakers = ref<(string | undefined)[]>(["Speaker 1", undefined, "Speaker 2"]);
+        const { colorDict } = useSpeakerColor(speakers);
+
+        expect(colorDict.value["Speaker 1"]).toBeDefined();
+        expect(colorDict.value["Speaker 2"]).toBeDefined();
+        expect(colorDict.value[undefined]).toBeUndefined();
+    });
+
+    it("should handle empty speakers array", () => {
+        const speakers = ref<string[]>([]);
+        const { colorDict, getSpeakerColor } = useSpeakerColor(speakers);
+
+        expect(Object.keys(colorDict.value)).toHaveLength(0);
+        expect(getSpeakerColor("Any")).toEqual({ r: 1, g: 1, b: 1 });
+    });
+});
diff --git a/tests/composables/useDateFormatter.test.ts b/tests/composables/useDateFormatter.test.ts
new file mode 100644
index 0000000..dd63097
--- /dev/null
+++ b/tests/composables/useDateFormatter.test.ts
@@ -0,0 +1,78 @@
+import { describe, expect, it, vi, beforeEach, afterEach } from "vitest";
+import { useDateFormatter } from "../../../app/composables/useDateFormatter";
+
+describe("useDateFormatter", () => {
+    let originalToLocaleString: typeof Date.prototype.toLocaleString;
+
+    beforeEach(() => {
+        originalToLocaleString = Date.prototype.toLocaleString;
+    });
+
+    afterEach(() => {
+        Date.prototype.toLocaleString = originalToLocaleString;
+    });
+
+    describe("formatDate", () => {
+        it("should format Date object", () => {
+            const { formatDate } = useDateFormatter();
+            const date = new Date("2024-01-15T14:30:00");
+
+            const result = formatDate(date);
+
+            expect(result).toContain("15");
+            expect(result).toContain("14:30");
+        });
+
+        it("should format timestamp number", () => {
+            const { formatDate } = useDateFormatter();
+            const timestamp = new Date("2024-06-20T09:15:00").getTime();
+
+            const result = formatDate(timestamp);
+
+            expect(result).toContain("20");
+            expect(result).toContain("09:15");
+        });
+
+        it("should use de-CH locale", () => {
+            const { formatDate } = useDateFormatter();
+            const date = new Date("2024-03-05T16:45:00");
+
+            Date.prototype.toLocaleString = vi.fn().mockReturnValue("5 Mar 16:45");
+
+            formatDate(date);
+
+            expect(Date.prototype.toLocaleString).toHaveBeenCalledWith(
+                "de-CH",
+                expect.objectContaining({
+                    day: "numeric",
+                    month: "short",
+                    hour: "2-digit",
+                    minute: "2-digit",
+                    hour12: false,
+                })
+            );
+        });
+
+        it("should handle different dates", () => {
+            const { formatDate } = useDateFormatter();
+
+            const result1 = formatDate(new Date("2024-01-01T00:00:00"));
+            const result2 = formatDate(new Date("2024-12-31T23:59:59"));
+
+            expect(result1).not.toBe(result2);
+        });
+
+        it("should handle same timestamp as number and Date", () => {
+            const { formatDate } = useDateFormatter();
+            const date = new Date("2024-07-10T12:00:00");
+            const timestamp = date.getTime();
+
+            Date.prototype.toLocaleString = vi.fn().mockReturnValue("10 Jul 12:00");
+
+            const result1 = formatDate(date);
+            const result2 = formatDate(timestamp);
+
+            expect(result1).toBe(result2);
+        });
+    });
+});
diff --git a/tests/composables/useTaskStatus.test.ts b/tests/composables/useTaskStatus.test.ts
new file mode 100644
index 0000000..0ed52e5
--- /dev/null
+++ b/tests/composables/useTaskStatus.test.ts
@@ -0,0 +1,154 @@
+import { describe, expect, it, vi, beforeEach } from "vitest";
+
+vi.mock("#imports", () => ({
+    useI18n: () => ({
+        t: (key: string) => key,
+    }),
+}));
+
+import { TaskStatusEnum, type TaskStatus } from "../../../app/types/task";
+
+function getStatusDisplay(status: string): string {
+    switch (status) {
+        case TaskStatusEnum.IN_PROGRESS:
+            return "processing.status.inProgress";
+        case TaskStatusEnum.COMPLETED:
+            return "processing.status.completed";
+        case TaskStatusEnum.FAILED:
+            return "processing.status.failed";
+        case TaskStatusEnum.CANCELLED:
+            return "processing.status.cancelled";
+        default:
+            return status;
+    }
+}
+
+function getStatusColor(status: string): string {
+    switch (status) {
+        case TaskStatusEnum.IN_PROGRESS:
+            return "info";
+        case TaskStatusEnum.COMPLETED:
+            return "success";
+        case TaskStatusEnum.FAILED:
+            return "error";
+        case TaskStatusEnum.CANCELLED:
+            return "neutral";
+        default:
+            return "neutral";
+    }
+}
+
+function computeTaskProgress(taskStatus: { status: string; progress: number | null }): number {
+    switch (taskStatus.status) {
+        case TaskStatusEnum.IN_PROGRESS:
+            return typeof taskStatus.progress === "number" ? taskStatus.progress : 0;
+        case TaskStatusEnum.COMPLETED:
+            return 1;
+        case TaskStatusEnum.FAILED:
+            return 1;
+        case TaskStatusEnum.CANCELLED:
+            return 0;
+        default:
+            return 0;
+    }
+}
+
+describe("useTaskStatus logic", () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+    });
+
+    describe("getStatusDisplay", () => {
+        it("should return translation key for IN_PROGRESS", () => {
+            expect(getStatusDisplay(TaskStatusEnum.IN_PROGRESS)).toBe("processing.status.inProgress");
+        });
+
+        it("should return translation key for COMPLETED", () => {
+            expect(getStatusDisplay(TaskStatusEnum.COMPLETED)).toBe("processing.status.completed");
+        });
+
+        it("should return translation key for FAILED", () => {
+            expect(getStatusDisplay(TaskStatusEnum.FAILED)).toBe("processing.status.failed");
+        });
+
+        it("should return translation key for CANCELLED", () => {
+            expect(getStatusDisplay(TaskStatusEnum.CANCELLED)).toBe("processing.status.cancelled");
+        });
+
+        it("should return status as-is for unknown status", () => {
+            expect(getStatusDisplay("unknown")).toBe("unknown");
+        });
+    });
+
+    describe("getStatusColor", () => {
+        it("should return 'info' for IN_PROGRESS", () => {
+            expect(getStatusColor(TaskStatusEnum.IN_PROGRESS)).toBe("info");
+        });
+
+        it("should return 'success' for COMPLETED", () => {
+            expect(getStatusColor(TaskStatusEnum.COMPLETED)).toBe("success");
+        });
+
+        it("should return 'error' for FAILED", () => {
+            expect(getStatusColor(TaskStatusEnum.FAILED)).toBe("error");
+        });
+
+        it("should return 'neutral' for CANCELLED", () => {
+            expect(getStatusColor(TaskStatusEnum.CANCELLED)).toBe("neutral");
+        });
+
+        it("should return 'neutral' for unknown status", () => {
+            expect(getStatusColor("unknown")).toBe("neutral");
+        });
+    });
+
+    describe("computeTaskProgress", () => {
+        it("should return progress value for IN_PROGRESS with progress", () => {
+            const task = {
+                status: TaskStatusEnum.IN_PROGRESS,
+                progress: 0.5,
+            };
+            expect(computeTaskProgress(task)).toBe(0.5);
+        });
+
+        it("should return 0 for IN_PROGRESS without progress", () => {
+            const task = {
+                status: TaskStatusEnum.IN_PROGRESS,
+                progress: null,
+            };
+            expect(computeTaskProgress(task)).toBe(0);
+        });
+
+        it("should return 1 for COMPLETED", () => {
+            const task = {
+                status: TaskStatusEnum.COMPLETED,
+                progress: null,
+            };
+            expect(computeTaskProgress(task)).toBe(1);
+        });
+
+        it("should return 1 for FAILED", () => {
+            const task = {
+                status: TaskStatusEnum.FAILED,
+                progress: null,
+            };
+            expect(computeTaskProgress(task)).toBe(1);
+        });
+
+        it("should return 0 for CANCELLED", () => {
+            const task = {
+                status: TaskStatusEnum.CANCELLED,
+                progress: 0.5,
+            };
+            expect(computeTaskProgress(task)).toBe(0);
+        });
+
+        it("should return 0 for unknown status", () => {
+            const task = {
+                status: "unknown",
+                progress: 0.5,
+            };
+            expect(computeTaskProgress(task)).toBe(0);
+        });
+    });
+});
diff --git a/tests/setup/vitest-setup.ts b/tests/setup/vitest-setup.ts
new file mode 100644
index 0000000..867c88d
--- /dev/null
+++ b/tests/setup/vitest-setup.ts
@@ -0,0 +1,41 @@
+import { config } from "@vue/test-utils";
+import { vi } from "vitest";
+
+vi.stubGlobal("indexedDB", {
+    open: vi.fn(),
+    deleteDatabase: vi.fn(),
+});
+
+const mockMatchMedia = vi.fn().mockImplementation((query: string) => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: vi.fn(),
+    removeListener: vi.fn(),
+    addEventListener: vi.fn(),
+    removeEventListener: vi.fn(),
+    dispatchEvent: vi.fn(),
+}));
+
+vi.stubGlobal("matchMedia", mockMatchMedia);
+
+const mockResizeObserver = vi.fn().mockImplementation(() => ({
+    observe: vi.fn(),
+    unobserve: vi.fn(),
+    disconnect: vi.fn(),
+}));
+
+vi.stubGlobal("ResizeObserver", mockResizeObserver);
+
+vi.stubGlobal("IntersectionObserver", vi.fn().mockImplementation(() => ({
+    observe: vi.fn(),
+    unobserve: vi.fn(),
+    disconnect: vi.fn(),
+})));
+
+config.global.mocks = {
+    $t: (key: string) => key,
+    $i18n: {
+        locale: "en",
+    },
+};
diff --git a/tests/types/task.test.ts b/tests/types/task.test.ts
new file mode 100644
index 0000000..d36cf1a
--- /dev/null
+++ b/tests/types/task.test.ts
@@ -0,0 +1,130 @@
+import { describe, expect, it } from "vitest";
+import {
+    TaskStatusEnumSchema,
+    TaskStatusSchema,
+    TaskStatusEnum,
+} from "../../../app/types/task";
+import { StoredTranscriptionSchema } from "../../../app/types/storedTranscription";
+
+describe("Task Types", () => {
+    describe("TaskStatusEnumSchema", () => {
+        it("should validate valid status values", () => {
+            expect(TaskStatusEnumSchema.safeParse("in_progress").success).toBe(true);
+            expect(TaskStatusEnumSchema.safeParse("completed").success).toBe(true);
+            expect(TaskStatusEnumSchema.safeParse("failed").success).toBe(true);
+            expect(TaskStatusEnumSchema.safeParse("cancelled").success).toBe(true);
+        });
+
+        it("should fail for invalid status values", () => {
+            expect(TaskStatusEnumSchema.safeParse("pending").success).toBe(false);
+            expect(TaskStatusEnumSchema.safeParse("running").success).toBe(false);
+            expect(TaskStatusEnumSchema.safeParse("").success).toBe(false);
+        });
+    });
+
+    describe("TaskStatusEnum constants", () => {
+        it("should have correct values", () => {
+            expect(TaskStatusEnum.IN_PROGRESS).toBe("in_progress");
+            expect(TaskStatusEnum.COMPLETED).toBe("completed");
+            expect(TaskStatusEnum.FAILED).toBe("failed");
+            expect(TaskStatusEnum.CANCELLED).toBe("cancelled");
+        });
+    });
+
+    describe("TaskStatusSchema", () => {
+        it("should validate valid task status", () => {
+            const task = {
+                task_id: "task-123",
+                status: "in_progress",
+                created_at: "2024-01-01T00:00:00Z",
+                executed_at: "2024-01-01T00:01:00Z",
+                progress: 0.5,
+            };
+
+            const result = TaskStatusSchema.safeParse(task);
+            expect(result.success).toBe(true);
+        });
+
+        it("should validate with null values", () => {
+            const task = {
+                task_id: "task-123",
+                status: "in_progress",
+                created_at: null,
+                executed_at: null,
+                progress: null,
+            };
+
+            const result = TaskStatusSchema.safeParse(task);
+            expect(result.success).toBe(true);
+        });
+
+        it("should fail for missing required fields", () => {
+            const task = {
+                task_id: "task-123",
+            };
+
+            const result = TaskStatusSchema.safeParse(task);
+            expect(result.success).toBe(false);
+        });
+    });
+});
+
+describe("StoredTranscriptionSchema", () => {
+    it("should validate valid stored transcription", () => {
+        const transcription = {
+            id: "trans-123",
+            segments: [
+                { id: "seg-1", start: 0, end: 5, text: "Hello" },
+            ],
+            name: "Test Transcription",
+            createdAt: "2024-01-01T00:00:00Z",
+            updatedAt: "2024-01-01T00:00:00Z",
+        };
+
+        const result = StoredTranscriptionSchema.safeParse(transcription);
+        expect(result.success).toBe(true);
+    });
+
+    it("should validate with optional fields", () => {
+        const transcription = {
+            id: "trans-123",
+            segments: [],
+            name: "Test",
+            createdAt: "2024-01-01T00:00:00Z",
+            updatedAt: "2024-01-01T00:00:00Z",
+            audioFileId: "audio-123",
+            mediaFileName: "test.mp3",
+            summary: "Test summary",
+        };
+
+        const result = StoredTranscriptionSchema.safeParse(transcription);
+        expect(result.success).toBe(true);
+    });
+
+    it("should convert date strings to Date objects", () => {
+        const transcription = {
+            id: "trans-123",
+            segments: [],
+            name: "Test",
+            createdAt: "2024-01-15T12:30:00Z",
+            updatedAt: "2024-01-15T12:30:00Z",
+        };
+
+        const result = StoredTranscriptionSchema.safeParse(transcription);
+        expect(result.success).toBe(true);
+        if (result.success) {
+            expect(result.data.createdAt).toBeInstanceOf(Date);
+            expect(result.data.updatedAt).toBeInstanceOf(Date);
+        }
+    });
+
+    it("should fail for missing required fields", () => {
+        const transcription = {
+            id: "trans-123",
+            name: "Test",
+        };
+
+        const result = StoredTranscriptionSchema.safeParse(transcription);
+        expect(result.success).toBe(false);
+    });
+});
diff --git a/tests/types/transcriptionResponse.test.ts b/tests/types/transcriptionResponse.test.ts
new file mode 100644
index 0000000..4d6641e
--- /dev/null
+++ b/tests/types/transcriptionResponse.test.ts
@@ -0,0 +1,229 @@
+import { describe, expect, it } from "vitest";
+import {
+    WordSchema,
+    SegmentSchema,
+    SegmentWithIdSchema,
+    TranscriptionResponseSchema,
+    VerboseSegmentSchema,
+    VerboseTranscriptionResponseSchema,
+} from "../../../app/types/transcriptionResponse";
+
+describe("Zod Schemas", () => {
+    describe("WordSchema", () => {
+        it("should validate valid word object", () => {
+            const word = {
+                start: 0.5,
+                end: 1.5,
+                word: "Hello",
+                probability: 0.95,
+                speaker: "Speaker 1",
+            };
+
+            const result = WordSchema.safeParse(word);
+            expect(result.success).toBe(true);
+        });
+
+        it("should validate word with null speaker", () => {
+            const word = {
+                start: 0.5,
+                end: 1.5,
+                word: "Hello",
+                probability: 0.95,
+                speaker: null,
+            };
+
+            const result = WordSchema.safeParse(word);
+            expect(result.success).toBe(true);
+        });
+
+        it("should fail for missing required fields", () => {
+            const word = {
+                start: 0.5,
+                end: 1.5,
+            };
+
+            const result = WordSchema.safeParse(word);
+            expect(result.success).toBe(false);
+        });
+
+        it("should fail for wrong types", () => {
+            const word = {
+                start: "0.5",
+                end: 1.5,
+                word: "Hello",
+                probability: 0.95,
+                speaker: "Speaker 1",
+            };
+
+            const result = WordSchema.safeParse(word);
+            expect(result.success).toBe(false);
+        });
+    });
+
+    describe("SegmentSchema", () => {
+        it("should validate valid segment object", () => {
+            const segment = {
+                start: 0,
+                end: 5,
+                text: "Hello world",
+                speaker: "Speaker 1",
+            };
+
+            const result = SegmentSchema.safeParse(segment);
+            expect(result.success).toBe(true);
+        });
+
+        it("should validate segment without speaker", () => {
+            const segment = {
+                start: 0,
+                end: 5,
+                text: "Hello world",
+            };
+
+            const result = SegmentSchema.safeParse(segment);
+            expect(result.success).toBe(true);
+        });
+
+        it("should fail for missing required fields", () => {
+            const segment = {
+                start: 0,
+                text: "Hello",
+            };
+
+            const result = SegmentSchema.safeParse(segment);
+            expect(result.success).toBe(false);
+        });
+    });
+
+    describe("SegmentWithIdSchema", () => {
+        it("should validate segment with id", () => {
+            const segment = {
+                id: "segment-1",
+                start: 0,
+                end: 5,
+                text: "Hello world",
+                speaker: "Speaker 1",
+            };
+
+            const result = SegmentWithIdSchema.safeParse(segment);
+            expect(result.success).toBe(true);
+        });
+
+        it("should fail without id", () => {
+            const segment = {
+                start: 0,
+                end: 5,
+                text: "Hello world",
+            };
+
+            const result = SegmentWithIdSchema.safeParse(segment);
+            expect(result.success).toBe(false);
+        });
+    });
+
+    describe("TranscriptionResponseSchema", () => {
+        it("should validate valid transcription response", () => {
+            const response = {
+                segments: [
+                    { start: 0, end: 5, text: "Hello" },
+                    { start: 5, end: 10, text: "World" },
+                ],
+            };
+
+            const result = TranscriptionResponseSchema.safeParse(response);
+            expect(result.success).toBe(true);
+        });
+
+        it("should validate empty segments array", () => {
+            const response = {
+                segments: [],
+            };
+
+            const result = TranscriptionResponseSchema.safeParse(response);
+            expect(result.success).toBe(true);
+        });
+
+        it("should fail for missing segments", () => {
+            const response = {};
+
+            const result = TranscriptionResponseSchema.safeParse(response);
+            expect(result.success).toBe(false);
+        });
+    });
+
+    describe("VerboseSegmentSchema", () => {
+        it("should validate valid verbose segment", () => {
+            const segment = {
+                id: 1,
+                seek: 0,
+                start: 0,
+                end: 5,
+                text: "Hello",
+                tokens: [1, 2, 3],
+                temperature: 0.5,
+                avg_logprob: -0.3,
+                compression_ratio: 1.5,
+                no_speech_prob: 0.01,
+                words: [
+                    {
+                        start: 0,
+                        end: 0.5,
+                        word: "Hello",
+                        probability: 0.95,
+                        speaker: null,
+                    },
+                ],
+                speaker: "Speaker 1",
+            };
+
+            const result = VerboseSegmentSchema.safeParse(segment);
+            expect(result.success).toBe(true);
+        });
+
+        it("should validate segment with null words", () => {
+            const segment = {
+                id: 1,
+                seek: 0,
+                start: 0,
+                end: 5,
+                text: "Hello",
+                tokens: [],
+                temperature: 0.5,
+                avg_logprob: -0.3,
+                compression_ratio: 1.5,
+                no_speech_prob: 0.01,
+                words: null,
+                speaker: null,
+            };
+
+            const result = VerboseSegmentSchema.safeParse(segment);
+            expect(result.success).toBe(true);
+        });
+    });
+
+    describe("VerboseTranscriptionResponseSchema", () => {
+        it("should validate valid verbose response", () => {
+            const response = {
+                task: "transcribe",
+                language: "en",
+                duration: 60,
+                text: "Hello world",
+                words: [],
+                segments: [],
+            };
+
+            const result = VerboseTranscriptionResponseSchema.safeParse(response);
+            expect(result.success).toBe(true);
+        });
+
+        it("should fail for missing required fields", () => {
+            const response = {
+                task: "transcribe",
+                language: "en",
+            };
+
+            const result = VerboseTranscriptionResponseSchema.safeParse(response);
+            expect(result.success).toBe(false);
+        });
+    });
+});
diff --git a/tests/unit/services/colorMapService.test.ts b/tests/unit/services/colorMapService.test.ts
new file mode 100644
index 0000000..d2046b8
--- /dev/null
+++ b/tests/unit/services/colorMapService.test.ts
@@ -0,0 +1,276 @@
+import { describe, expect, it } from "vitest";
+import {
+    rainbow,
+    grayscale,
+    viridis,
+    inferno,
+    magma,
+    textFriendly,
+    getColorMap,
+} from "../../../app/services/colorMapService";
+import { RGBColor } from "../../../app/types/color";
+
+describe("rainbow", () => {
+    it("should return blue at 0", () => {
+        const result = rainbow(0);
+        expect(result.r).toBe(0);
+        expect(result.b).toBe(255);
+    });
+
+    it("should return white at 1", () => {
+        const result = rainbow(1);
+        expect(result.r).toBe(255);
+        expect(result.g).toBeGreaterThanOrEqual(254);
+        expect(result.g).toBeLessThanOrEqual(255);
+        expect(result.b).toBeGreaterThanOrEqual(254);
+        expect(result.b).toBeLessThanOrEqual(255);
+    });
+
+    it("should clamp values below 0", () => {
+        const result = rainbow(-0.5);
+        expect(result).toEqual(rainbow(0));
+    });
+
+    it("should clamp values above 1", () => {
+        const result = rainbow(1.5);
+        expect(result).toEqual(rainbow(1));
+    });
+
+    it("should return RGBColor instance", () => {
+        const result = rainbow(0.5);
+        expect(result).toBeInstanceOf(RGBColor);
+    });
+
+    it("should have cyan in 0.2 range", () => {
+        const result = rainbow(0.2);
+        expect(result.g).toBe(255);
+        expect(result.b).toBe(255);
+    });
+
+    it("should have green in 0.4 range", () => {
+        const result = rainbow(0.4);
+        expect(result.g).toBe(255);
+    });
+
+    it("should have yellow in 0.6 range", () => {
+        const result = rainbow(0.6);
+        expect(result.r).toBe(255);
+        expect(result.g).toBe(255);
+    });
+
+    it("should have red in 0.8 range", () => {
+        const result = rainbow(0.8);
+        expect(result.r).toBe(255);
+    });
+});
+
+describe("grayscale", () => {
+    it("should return black at 0", () => {
+        const result = grayscale(0);
+        expect(result.r).toBe(0);
+        expect(result.g).toBe(0);
+        expect(result.b).toBe(0);
+    });
+
+    it("should return white at 1", () => {
+        const result = grayscale(1);
+        expect(result.r).toBe(255);
+        expect(result.g).toBe(255);
+        expect(result.b).toBe(255);
+    });
+
+    it("should return equal RGB values", () => {
+        const result = grayscale(0.5);
+        expect(result.r).toBe(result.g);
+        expect(result.g).toBe(result.b);
+    });
+
+    it("should return 127 for 0.5", () => {
+        const result = grayscale(0.5);
+        expect(result.r).toBe(127);
+    });
+
+    it("should clamp values below 0", () => {
+        const result = grayscale(-0.5);
+        expect(result).toEqual(grayscale(0));
+    });
+
+    it("should clamp values above 1", () => {
+        const result = grayscale(1.5);
+        expect(result).toEqual(grayscale(1));
+    });
+});
+
+describe("viridis", () => {
+    it("should return dark color at 0", () => {
+        const result = viridis(0);
+        expect(result.r).toBe(0);
+        expect(result.g).toBe(1);
+        expect(result.b).toBe(84);
+    });
+
+    it("should return lighter color at 1", () => {
+        const result = viridis(1);
+        expect(result.r).toBeGreaterThanOrEqual(220);
+        expect(result.r).toBeLessThanOrEqual(224);
+        expect(result.g).toBeGreaterThanOrEqual(213);
+        expect(result.g).toBeLessThanOrEqual(217);
+        expect(result.b).toBeLessThanOrEqual(5);
+    });
+
+    it("should clamp values", () => {
+        expect(viridis(-0.5)).toEqual(viridis(0));
+        expect(viridis(1.5)).toEqual(viridis(1));
+    });
+
+    it("should return RGBColor instance", () => {
+        expect(viridis(0.5)).toBeInstanceOf(RGBColor);
+    });
+});
+
+describe("inferno", () => {
+    it("should return dark color at 0", () => {
+        const result = inferno(0);
+        expect(result.r).toBe(20);
+        expect(result.g).toBe(7);
+        expect(result.b).toBe(37);
+    });
+
+    it("should return bright color at 1", () => {
+        const result = inferno(1);
+        expect(result.r).toBe(255);
+        expect(result.g).toBe(255);
+        expect(result.b).toBe(205);
+    });
+
+    it("should clamp values", () => {
+        expect(inferno(-0.5)).toEqual(inferno(0));
+        expect(inferno(1.5)).toEqual(inferno(1));
+    });
+
+    it("should return RGBColor instance", () => {
+        expect(inferno(0.5)).toBeInstanceOf(RGBColor);
+    });
+});
+
+describe("magma", () => {
+    it("should return dark color at 0", () => {
+        const result = magma(0);
+        expect(result.r).toBe(15);
+        expect(result.g).toBe(5);
+        expect(result.b).toBe(45);
+    });
+
+    it("should return light color at 1", () => {
+        const result = magma(1);
+        expect(result.r).toBe(255);
+        expect(result.g).toBe(255);
+        expect(result.b).toBe(255);
+    });
+
+    it("should clamp values", () => {
+        expect(magma(-0.5)).toEqual(magma(0));
+        expect(magma(1.5)).toEqual(magma(1));
+    });
+
+    it("should return RGBColor instance", () => {
+        expect(magma(0.5)).toBeInstanceOf(RGBColor);
+    });
+});
+
+describe("textFriendly", () => {
+    it("should return dark blue for first segment", () => {
+        const result = textFriendly(0);
+        expect(result.r).toBe(0);
+        expect(result.g).toBe(51);
+        expect(result.b).toBe(153);
+    });
+
+    it("should return green for second segment", () => {
+        const result = textFriendly(0.2);
+        expect(result.r).toBe(0);
+        expect(result.g).toBe(128);
+        expect(result.b).toBe(0);
+    });
+
+    it("should return dark red for third segment", () => {
+        const result = textFriendly(0.35);
+        expect(result.r).toBe(153);
+        expect(result.g).toBe(0);
+        expect(result.b).toBe(0);
+    });
+
+    it("should return purple for fourth segment", () => {
+        const result = textFriendly(0.5);
+        expect(result.r).toBe(102);
+        expect(result.g).toBe(0);
+        expect(result.b).toBe(153);
+    });
+
+    it("should return teal for fifth segment", () => {
+        const result = textFriendly(0.65);
+        expect(result.r).toBe(0);
+        expect(result.g).toBe(128);
+        expect(result.b).toBe(128);
+    });
+
+    it("should return dark orange for sixth segment", () => {
+        const result = textFriendly(0.75);
+        expect(result.r).toBe(204);
+        expect(result.g).toBe(85);
+        expect(result.b).toBe(0);
+    });
+
+    it("should return dark magenta for last segment", () => {
+        const result = textFriendly(0.9);
+        expect(result.r).toBe(139);
+        expect(result.g).toBe(0);
+        expect(result.b).toBe(139);
+    });
+
+    it("should clamp values", () => {
+        expect(textFriendly(-0.5)).toEqual(textFriendly(0));
+        expect(textFriendly(1.5)).toEqual(textFriendly(1));
+    });
+
+    it("should return RGBColor instance", () => {
+        expect(textFriendly(0.5)).toBeInstanceOf(RGBColor);
+    });
+});
+
+describe("getColorMap", () => {
+    it("should return rainbow function for 'rainbow'", () => {
+        const colorMap = getColorMap("rainbow");
+        expect(colorMap(0.5)).toEqual(rainbow(0.5));
+    });
+
+    it("should return grayscale function for 'grayscale'", () => {
+        const colorMap = getColorMap("grayscale");
+        expect(colorMap(0.5)).toEqual(grayscale(0.5));
+    });
+
+    it("should return viridis function for 'viridis'", () => {
+        const colorMap = getColorMap("viridis");
+        expect(colorMap(0.5)).toEqual(viridis(0.5));
+    });
+
+    it("should return inferno function for 'inferno'", () => {
+        const colorMap = getColorMap("inferno");
+        expect(colorMap(0.5)).toEqual(inferno(0.5));
+    });
+
+    it("should return magma function for 'magma'", () => {
+        const colorMap = getColorMap("magma");
+        expect(colorMap(0.5)).toEqual(magma(0.5));
+    });
+
+    it("should return textFriendly function for 'textFriendly'", () => {
+        const colorMap = getColorMap("textFriendly");
+        expect(colorMap(0.5)).toEqual(textFriendly(0.5));
+    });
+
+    it("should return rainbow as default for unknown type", () => {
+        const colorMap = getColorMap("unknown" as never);
+        expect(colorMap(0.5)).toEqual(rainbow(0.5));
+    });
+});
diff --git a/tests/unit/services/indexDbService.test.ts b/tests/unit/services/indexDbService.test.ts
new file mode 100644
index 0000000..b54a7c1
--- /dev/null
+++ b/tests/unit/services/indexDbService.test.ts
@@ -0,0 +1,43 @@
+import { describe, expect, it, vi, beforeEach, afterEach } from "vitest";
+
+describe("indexDbService constants and helpers", () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+    });
+
+    afterEach(() => {
+        vi.unstubAllGlobals();
+    });
+
+    describe("database constants", () => {
+        it("should use correct database name", () => {
+            const DB_NAME = "transcribo-db";
+            expect(DB_NAME).toBe("transcribo-db");
+        });
+
+        it("should use correct store names", () => {
+            const TRANSCIPTION_STORE_NAME = "transcriptions";
+            const TASK_STORE_NAME = "tasks";
+            
+            expect(TRANSCIPTION_STORE_NAME).toBe("transcriptions");
+            expect(TASK_STORE_NAME).toBe("tasks");
+        });
+
+        it("should use correct database version", () => {
+            const DB_VERSION = 3;
+            expect(DB_VERSION).toBe(3);
+        });
+    });
+
+    describe("IndexedDB mock availability", () => {
+        it("should have indexedDB available in global scope", () => {
+            vi.stubGlobal("indexedDB", {
+                open: vi.fn(),
+                deleteDatabase: vi.fn(),
+            });
+            
+            expect(indexedDB).toBeDefined();
+            expect(typeof indexedDB.open).toBe("function");
+        });
+    });
+});
diff --git a/tests/unit/utils/httpErrorCode.test.ts b/tests/unit/utils/httpErrorCode.test.ts
new file mode 100644
index 0000000..d2c5b55
--- /dev/null
+++ b/tests/unit/utils/httpErrorCode.test.ts
@@ -0,0 +1,95 @@
+import { describe, expect, it } from "vitest";
+import { isHttpStatusCode } from "../../../app/utils/httpErrorCode";
+
+describe("isHttpStatusCode", () => {
+    describe("statusCode property", () => {
+        it("should return true when statusCode matches", () => {
+            const error = { statusCode: 404 };
+            expect(isHttpStatusCode(error, 404)).toBe(true);
+        });
+
+        it("should return false when statusCode does not match", () => {
+            const error = { statusCode: 404 };
+            expect(isHttpStatusCode(error, 500)).toBe(false);
+        });
+
+        it("should handle various status codes", () => {
+            expect(isHttpStatusCode({ statusCode: 200 }, 200)).toBe(true);
+            expect(isHttpStatusCode({ statusCode: 401 }, 401)).toBe(true);
+            expect(isHttpStatusCode({ statusCode: 503 }, 503)).toBe(true);
+        });
+    });
+
+    describe("response.status property", () => {
+        it("should return true when response.status matches", () => {
+            const error = { response: { status: 404 } };
+            expect(isHttpStatusCode(error, 404)).toBe(true);
+        });
+
+        it("should return false when response.status does not match", () => {
+            const error = { response: { status: 404 } };
+            expect(isHttpStatusCode(error, 500)).toBe(false);
+        });
+    });
+
+    describe("status property", () => {
+        it("should return true when status matches", () => {
+            const error = { status: 404 };
+            expect(isHttpStatusCode(error, 404)).toBe(true);
+        });
+
+        it("should return false when status does not match", () => {
+            const error = { status: 404 };
+            expect(isHttpStatusCode(error, 500)).toBe(false);
+        });
+    });
+
+    describe("invalid inputs", () => {
+        it("should return false for null", () => {
+            expect(isHttpStatusCode(null, 404)).toBe(false);
+        });
+
+        it("should return false for undefined", () => {
+            expect(isHttpStatusCode(undefined, 404)).toBe(false);
+        });
+
+        it("should return false for string", () => {
+            expect(isHttpStatusCode("error", 404)).toBe(false);
+        });
+
+        it("should return false for number", () => {
+            expect(isHttpStatusCode(404, 404)).toBe(false);
+        });
+
+        it("should return false for empty object", () => {
+            expect(isHttpStatusCode({}, 404)).toBe(false);
+        });
+
+        it("should return false when statusCode is not a number", () => {
+            const error = { statusCode: "404" };
+            expect(isHttpStatusCode(error, 404)).toBe(false);
+        });
+
+        it("should return false when status is not a number", () => {
+            const error = { status: "404" };
+            expect(isHttpStatusCode(error, 404)).toBe(false);
+        });
+    });
+
+    describe("priority", () => {
+        it("should check statusCode first", () => {
+            const error = { statusCode: 404, status: 500, response: { status: 503 } };
+            expect(isHttpStatusCode(error, 404)).toBe(true);
+        });
+
+        it("should check response.status if statusCode does not match", () => {
+            const error = { statusCode: 404, status: 500, response: { status: 503 } };
+            expect(isHttpStatusCode(error, 503)).toBe(true);
+        });
+
+        it("should check status if others do not match", () => {
+            const error = { statusCode: 404, response: { status: 503 }, status: 500 };
+            expect(isHttpStatusCode(error, 500)).toBe(true);
+        });
+    });
+});
diff --git a/tests/unit/utils/math.test.ts b/tests/unit/utils/math.test.ts
new file mode 100644
index 0000000..bd37a2e
--- /dev/null
+++ b/tests/unit/utils/math.test.ts
@@ -0,0 +1,97 @@
+import { describe, expect, it } from "vitest";
+import { clamp, clamp01, mapRange } from "../../../app/utils/math";
+
+describe("clamp", () => {
+    it("should return value when within range", () => {
+        expect(clamp(5, 0, 10)).toBe(5);
+    });
+
+    it("should return min when value is below range", () => {
+        expect(clamp(-5, 0, 10)).toBe(0);
+    });
+
+    it("should return max when value is above range", () => {
+        expect(clamp(15, 0, 10)).toBe(10);
+    });
+
+    it("should handle negative ranges", () => {
+        expect(clamp(-5, -10, -1)).toBe(-5);
+    });
+
+    it("should handle value equal to min", () => {
+        expect(clamp(0, 0, 10)).toBe(0);
+    });
+
+    it("should handle value equal to max", () => {
+        expect(clamp(10, 0, 10)).toBe(10);
+    });
+
+    it("should handle decimal values", () => {
+        expect(clamp(0.5, 0, 1)).toBe(0.5);
+    });
+
+    it("should handle inverted min/max", () => {
+        expect(clamp(5, 10, 0)).toBe(10);
+    });
+});
+
+describe("clamp01", () => {
+    it("should return value when within 0-1 range", () => {
+        expect(clamp01(0.5)).toBe(0.5);
+    });
+
+    it("should return 0 when value is negative", () => {
+        expect(clamp01(-0.5)).toBe(0);
+    });
+
+    it("should return 1 when value is above 1", () => {
+        expect(clamp01(1.5)).toBe(1);
+    });
+
+    it("should handle 0", () => {
+        expect(clamp01(0)).toBe(0);
+    });
+
+    it("should handle 1", () => {
+        expect(clamp01(1)).toBe(1);
+    });
+
+    it("should handle very small positive values", () => {
+        expect(clamp01(0.001)).toBe(0.001);
+    });
+});
+
+describe("mapRange", () => {
+    it("should map from one range to another", () => {
+        expect(mapRange(5, 0, 10, 0, 100)).toBe(50);
+    });
+
+    it("should map negative to positive range", () => {
+        expect(mapRange(0, -10, 10, 0, 100)).toBe(50);
+    });
+
+    it("should map inMin value to outMin", () => {
+        expect(mapRange(0, 0, 10, 100, 200)).toBe(100);
+    });
+
+    it("should map inMax value to outMax", () => {
+        expect(mapRange(10, 0, 10, 100, 200)).toBe(200);
+    });
+
+    it("should handle values outside input range", () => {
+        expect(mapRange(15, 0, 10, 0, 100)).toBe(150);
+    });
+
+    it("should handle same input min and max", () => {
+        expect(mapRange(5, 0, 0, 0, 100)).toBe(Infinity);
+    });
+
+    it("should handle decimal values", () => {
+        expect(mapRange(2.5, 0, 10, 0, 1)).toBeCloseTo(0.25);
+    });
+
+    it("should handle reversed output range", () => {
+        expect(mapRange(0, 0, 10, 100, 0)).toBe(100);
+        expect(mapRange(10, 0, 10, 100, 0)).toBe(0);
+    });
+});
diff --git a/tests/unit/utils/speakerUtils.test.ts b/tests/unit/utils/speakerUtils.test.ts
new file mode 100644
index 0000000..6456563
--- /dev/null
+++ b/tests/unit/utils/speakerUtils.test.ts
@@ -0,0 +1,62 @@
+import { describe, expect, it } from "vitest";
+import { getUniqueSpeakers } from "../../../app/utils/speakerUtils";
+import type { Segment } from "../../../app/types/transcriptionResponse";
+
+describe("getUniqueSpeakers", () => {
+    it("should return empty set for empty array", () => {
+        const result = getUniqueSpeakers([]);
+        expect(result.size).toBe(0);
+    });
+
+    it("should return single speaker", () => {
+        const segments: Segment[] = [
+            { start: 0, end: 5, text: "Hello", speaker: "Speaker 1" },
+        ];
+        const result = getUniqueSpeakers(segments);
+        expect(result).toEqual(new Set(["Speaker 1"]));
+    });
+
+    it("should return unique speakers", () => {
+        const segments: Segment[] = [
+            { start: 0, end: 5, text: "Hello", speaker: "Speaker 1" },
+            { start: 5, end: 10, text: "World", speaker: "Speaker 2" },
+            { start: 10, end: 15, text: "Again", speaker: "Speaker 1" },
+        ];
+        const result = getUniqueSpeakers(segments);
+        expect(result).toEqual(new Set(["Speaker 1", "Speaker 2"]));
+    });
+
+    it("should handle undefined speakers as 'unknown'", () => {
+        const segments: Segment[] = [
+            { start: 0, end: 5, text: "Hello", speaker: undefined },
+        ];
+        const result = getUniqueSpeakers(segments);
+        expect(result).toEqual(new Set(["unknown"]));
+    });
+
+    it("should handle mixed defined and undefined speakers", () => {
+        const segments: Segment[] = [
+            { start: 0, end: 5, text: "Hello", speaker: "Speaker 1" },
+            { start: 5, end: 10, text: "World", speaker: undefined },
+            { start: 10, end: 15, text: "Again", speaker: "Speaker 1" },
+        ];
+        const result = getUniqueSpeakers(segments);
+        expect(result).toEqual(new Set(["Speaker 1", "unknown"]));
+    });
+
+    it("should handle segments without speaker field", () => {
+        const segments: Segment[] = [
+            { start: 0, end: 5, text: "Hello" },
+        ];
+        const result = getUniqueSpeakers(segments);
+        expect(result).toEqual(new Set(["unknown"]));
+    });
+
+    it("should handle empty string speaker", () => {
+        const segments: Segment[] = [
+            { start: 0, end: 5, text: "Hello", speaker: "" },
+        ];
+        const result = getUniqueSpeakers(segments);
+        expect(result).toEqual(new Set([""]));
+    });
+});
diff --git a/tests/unit/utils/time.test.ts b/tests/unit/utils/time.test.ts
new file mode 100644
index 0000000..8a67b85
--- /dev/null
+++ b/tests/unit/utils/time.test.ts
@@ -0,0 +1,108 @@
+import { describe, expect, it } from "vitest";
+import { formatTime, parseTime } from "../../../app/utils/time";
+
+describe("formatTime", () => {
+    describe("with milliseconds (default)", () => {
+        it("should format zero time", () => {
+            expect(formatTime(0)).toBe("0:00.000");
+        });
+
+        it("should format seconds only", () => {
+            expect(formatTime(30)).toBe("0:30.000");
+        });
+
+        it("should format minutes and seconds", () => {
+            expect(formatTime(90)).toBe("1:30.000");
+        });
+
+        it("should format hours correctly", () => {
+            expect(formatTime(3661.5)).toBe("61:01.500");
+        });
+
+        it("should handle milliseconds correctly", () => {
+            expect(formatTime(1.234)).toBe("0:01.234");
+        });
+
+        it("should pad single digit seconds", () => {
+            expect(formatTime(65)).toBe("1:05.000");
+        });
+
+        it("should handle fractional milliseconds", () => {
+            expect(formatTime(1.9999)).toBe("0:01.999");
+        });
+    });
+
+    describe("without milliseconds", () => {
+        it("should format without milliseconds when option is false", () => {
+            expect(formatTime(90, { milliseconds: false })).toBe("1:30");
+        });
+
+        it("should format zero time without milliseconds", () => {
+            expect(formatTime(0, { milliseconds: false })).toBe("0:00");
+        });
+
+        it("should truncate milliseconds", () => {
+            expect(formatTime(1.999, { milliseconds: false })).toBe("0:01");
+        });
+    });
+
+    describe("edge cases", () => {
+        it("should handle very small values", () => {
+            expect(formatTime(0.001)).toBe("0:00.001");
+        });
+
+        it("should handle large values", () => {
+            expect(formatTime(7384.567)).toBe("123:04.567");
+        });
+    });
+});
+
+describe("parseTime", () => {
+    describe("valid inputs", () => {
+        it("should parse zero time", () => {
+            expect(parseTime("0:00")).toBe(0);
+        });
+
+        it("should parse seconds only", () => {
+            expect(parseTime("0:30")).toBe(30);
+        });
+
+        it("should parse minutes and seconds", () => {
+            expect(parseTime("1:30")).toBe(90);
+        });
+
+        it("should parse large minute values", () => {
+            expect(parseTime("60:00")).toBe(3600);
+        });
+
+        it("should parse single digit minutes", () => {
+            expect(parseTime("5:15")).toBe(315);
+        });
+    });
+
+    describe("invalid inputs", () => {
+        it("should throw error for missing colon", () => {
+            expect(() => parseTime("130")).toThrow("Invalid time format");
+        });
+
+        it("should throw error for multiple colons", () => {
+            expect(() => parseTime("1:30:00")).toThrow("Invalid time format");
+        });
+
+        it("should throw error for non-numeric values", () => {
+            expect(() => parseTime("a:bb")).toThrow("Invalid time format");
+        });
+
+        it("should throw error for empty string", () => {
+            expect(() => parseTime("")).toThrow("Invalid time format");
+        });
+
+        it("should throw error for partial input", () => {
+            expect(() => parseTime("1:")).toThrow("Invalid time format");
+        });
+
+        it("should throw error for negative values", () => {
+            expect(() => parseTime("-1:30")).not.toThrow();
+        });
+    });
+});
diff --git a/tests/unit/utils/videoUtils.test.ts b/tests/unit/utils/videoUtils.test.ts
new file mode 100644
index 0000000..fb3fbbf
--- /dev/null
+++ b/tests/unit/utils/videoUtils.test.ts
@@ -0,0 +1,65 @@
+import { describe, expect, it } from "vitest";
+import { isVideoFile } from "../../../app/utils/videoUtils";
+
+describe("isVideoFile", () => {
+    describe("video files", () => {
+        it("should return true for mp4 video", () => {
+            const file = new File([""], "video.mp4", { type: "video/mp4" });
+            expect(isVideoFile(file)).toBe(true);
+        });
+
+        it("should return true for webm video", () => {
+            const file = new File([""], "video.webm", { type: "video/webm" });
+            expect(isVideoFile(file)).toBe(true);
+        });
+
+        it("should return true for quicktime video", () => {
+            const file = new File([""], "video.mov", { type: "video/quicktime" });
+            expect(isVideoFile(file)).toBe(true);
+        });
+
+        it("should return true for avi video", () => {
+            const file = new File([""], "video.avi", { type: "video/x-msvideo" });
+            expect(isVideoFile(file)).toBe(true);
+        });
+    });
+
+    describe("non-video files", () => {
+        it("should return false for audio files", () => {
+            const file = new File([""], "audio.mp3", { type: "audio/mpeg" });
+            expect(isVideoFile(file)).toBe(false);
+        });
+
+        it("should return false for image files", () => {
+            const file = new File([""], "image.png", { type: "image/png" });
+            expect(isVideoFile(file)).toBe(false);
+        });
+
+        it("should return false for text files", () => {
+            const file = new File([""], "text.txt", { type: "text/plain" });
+            expect(isVideoFile(file)).toBe(false);
+        });
+
+        it("should return false for empty type", () => {
+            const file = new File([""], "file.bin", { type: "" });
+            expect(isVideoFile(file)).toBe(false);
+        });
+
+        it("should return false for Blob with non-video type", () => {
+            const blob = new Blob([""], { type: "audio/wav" });
+            expect(isVideoFile(blob)).toBe(false);
+        });
+    });
+
+    describe("Blob vs File", () => {
+        it("should work with Blob objects", () => {
+            const blob = new Blob([""], { type: "video/mp4" });
+            expect(isVideoFile(blob)).toBe(true);
+        });
+
+        it("should work with File objects", () => {
+            const file = new File([""], "video.mp4", { type: "video/mp4" });
+            expect(isVideoFile(file)).toBe(true);
+        });
+    });
+});
diff --git a/vitest.config.ts b/vitest.config.ts
new file mode 100644
index 0000000..6460803
--- /dev/null
+++ b/vitest.config.ts
@@ -0,0 +1,32 @@
+import { fileURLToPath } from "node:url";
+import { defineVitestConfig } from "@nuxt/test-utils/config";
+
+export default defineVitestConfig({
+    test: {
+        globals: true,
+        environment: "happy-dom",
+        setupFiles: ["./tests/setup/vitest-setup.ts"],
+        include: ["tests/**/*.test.ts"],
+        exclude: ["node_modules", "dist", ".nuxt"],
+        coverage: {
+            provider: "v8",
+            reporter: ["text", "json", "html"],
+            exclude: [
+                "node_modules",
+                "tests",
+                "**/*.d.ts",
+                "**/*.config.*",
+                "**/dist/**",
+                ".nuxt",
+            ],
+        },
+        testTimeout: 30000,
+        hookTimeout: 30000,
+    },
+    resolve: {
+        alias: {
+            "~": fileURLToPath(new URL("./app", import.meta.url)),
+            "~~": fileURLToPath(new URL(".", import.meta.url)),
+        },
+    },
+});